js getElementsByClassName与querySelector querySelectorAll的区别

最新推荐文章于 2023-10-24 18:37:19 发布

weixin_34074740

最新推荐文章于 2023-10-24 18:37:19 发布

阅读量220

点赞数

CC 4.0 BY-SA版权

文章标签： 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>

效果图：