如何通过css选择器来获取元素

原创 2018-12-15 11:29:40 253
摘要:<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>如何通过css选择器来获取元素</title> <script type="text/javascript"></script></head&

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>如何通过css选择器来获取元素</title>

<script type="text/javascript"></script>

</head>

<body>

<ul id="ul">

<li class="green">表格0</li>

<li>表格1</li>

<li class="green">表格2</li>

<li class="pink">表格3</li>

<li class="red">表格4</li>

<li class="green">表格5</li>

</ul>

<script>

 //选择页面元素

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

  lists[3].style.backgroundColor='coral'

  lists.item(4).style.backgroundColor='lightblue'

 //元素上调用

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

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

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

  li[i].style.backgroundColor='green'

  }

</script>

</body>

</html>


发布手记

热门词条