无限增加screen-1-h2-animate-init

var screenAnimateElements={
	'.screen-1':[
		'.screen-1-h2',
		'screen-1-h3',
	]
};

function setScreenAnimate(screenCls){
	var screen= document.querySelector(screenCls);//获取当前屏幕的元素
	var animateElements=screenAnimateElements[screenCls];//需要设置动画的元素
	var isSetAnimateClass=false;//是否有初始化子元素的样式
	var isAnimateDone=false; //当前屏幕下所有子元素的状态是Done

	screen.onclick=function(){
		//初始化样式，增加init
		if(isSetAnimateClass===false){
			for (var i=0;i<animateElements.length;i++){

				var element=document.querySelector(animateElements[i]);
				var baseCls=element.getAttribute('class');

				element.setAttribute('class',baseCls+' '+animateElements[i].substr(1)+'-animate-init');
			}
			isSetAnimateClass=true;
			return;
		}
		//却换所有animateElements init -> done
		if(isAnimateDone===false){
			for (var i=0;i<animateElements.length;i++){

				var element=document.querySelector(animateElements[i]);
				var baseCls=element.getAttribute('class');

				element.setAttribute('class',baseCls.replace('-animate-init','-animate-done'));
			}
			isAnimateDone = true;
      		return ;
		}
		//却换所有animateElements  done-> init 
		if(isAnimateDone===true){
			for (var i=0;i<animateElements.length;i++){

				var element=document.querySelector(animateElements[i]);
				var baseCls=element.getAttribute('class');

				element.setAttribute('class',baseCls.replace('-animate-done','-animate-init'));
			}
			isAnimateDone = false;
        	return ;
		}
	}
}


setScreenAnimate('.screen-1');

控制台部分无限增加screen-1-h2-animate-init

下面是HMTL部分的第一屏幕

<div class="screen-1">

<h2 class="screen-1-h2 ">实战课程重磅上线</h2>

<h3 class="screen-1-h3 ">一键云学习,还在等什么？</h3>

</div>