js getElementsByClassName与querySelector querySelectorAll的区别

最新推荐文章于 2024-04-15 11:18:20 发布

weixin_34074740

最新推荐文章于 2024-04-15 11:18:20 发布

阅读量196

点赞数

文章标签： python javascript ViewUI

原文链接：https://my.oschina.net/u/3680343/blog/1562959

版权

2019独角兽企业重金招聘Python工程师标准>>>

关于它们的区别，我写了个简单的小例子，代码如下

代码如图：

<body>
	<ul>
		<li class="items-li">测试数据1</li>
		<li class="items-li">测试数据2</li>
		<li class="items-li">测试数据3</li>
		<li class="items-li">测试数据4</li>
		<li class="items-li">测试数据5</li>
		<li class="items-li">测试数据6</li>
		<li class="items-li">测试数据7</li>
		<li class="items-li">测试数据8</li>
	</ul>
	<script type="text/javascript">
		console.log("输出getElementsByClassName得到的结果");
		var byClass=document.getElementsByClassName("items-li");
		console.log(byClass);
		console.log("输出querySelectorAll得到的结果");
		var selectorAll=document.querySelectorAll(".items-li");
		console.log(selectorAll);
		console.log("输出querySelector得到的结果");
		var selector=document.querySelector(".items-li");
		console.log(selector);
	</script>
</body>

效果图：