通过css选择器来获取元素

Original 2019-04-04 12:40:27 245
abstract:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <ul id="ul"> <li class="red&qu

<!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="coral large">列表项05</li>

</ul>

<script>

//querySelectorAll() 返回数组

let lists=document.querySelectorAll('li');

console.log(lists);

lists[0].style.background='red';

//querySelector 返回一个

let ul=document.querySelector('#ul');

console.log(ul);

//ul.style.background='green';

let li=ul.querySelectorAll('.green');

console.log(li);

for(let i=0;i<li.length;i++){

li[i].style.background='lavender';

}

</script>

</body>

</html>


<!-- 总结

querySelectorAll() 返回的是数组

queryslector() 返回满足条件的第一个 -->


Correcting teacher:天蓬老师Correction time:2019-04-04 14:24:06
Teacher's summary:这个作业很眼熟, 你是不是重复提交了一次

Release Notes

Popular Entries