Question

document.getElementById()改ByClassName这段JS就没效果了

网上找了一段图片放大的JS代码，因为是ById所以只能对单个Id="pics"有效，想改成对多个class="pics"有效，求大神帮忙function scale1(){document.getElementById("pics").style.WebkitTransform="scale(1.2)";document.getElementById("pics").style.WebkitTransition="all .5s";}function scale2(){document.getElementById("pics").style.WebkitTransform="scale(1)";document.getElementById("pics").style.WebkitTransition="all .5s";}

Answer 1

您好！很高兴为您解答：

js获取id的时候，id是唯一的，但是获取className就不一样了，有很多了，您的先让js知道修改哪个的css，看您这样是让每一个都有这个效果，所以这里做一个小小的修改：

<script>
	var pics=document.getElementsByClassName('pics');//这里为了简单写下面的东西，所以做一个全局变量
	function scale1() {
		for(var i=0;i<pics.length;i++){//让每一个都有效果，所以这里需要使用循环
    pics[i].style.WebkitTransform = "scale(1.2)";
    pics[i].style.WebkitTransition = "all .5s";
   	}  
}
	function scale2() {
		for(var i=0;i<pics.length;i++){//让每一个都有效果，所以这里需要使用循环
    pics[i].style.WebkitTransform = "scale(1)";
    pics[i].style.WebkitTransition = "all .5s";
   }
}	
</script>

望采纳。