收藏
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<ul id="ul">
<li class="red">列表项01</li>
<li>列表项02</li>
<li class="green">列表项03</li>
<li class="green">列表项04</li>
<li class="yellow">列表项05</li>
</ul>
</body>
<script>
var lists = document.querySelectorAll('li'); //返回所有选择器匹配的元素，是一个数组
// console.log(lists)
lists[0].style.background = 'pink'
lists.item(1).style.background = 'yellow'
//querySelector(All)方法也可以在元素上调用
var ul = document.querySelector('#ul') //querySelector 返回匹配的以第一个元素
// console.log(ul)
var li = ul.querySelectorAll('.green')
// console.log(li)
for(var i=0;i<li.length;i++){
li[i].style.background = 'green'
}
</script>
</html>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
