5.选择器.html 959 B

1234567891011121314151617181920212223242526272829303132
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Document</title>
  7. </head>
  8. <body>
  9. <ul id="list" class="main">
  10. <li>333</li>
  11. <li>333</li>
  12. <li>333</li>
  13. </ul>
  14. <!--
  15. 通过css选择器获取
  16. querySelector、getElementById 获取标签元素
  17. querySelectorAll、getElementsByClassName、getElementsByTagName 获取的是数组(类数组)
  18. -->
  19. <script>
  20. var ul = document.querySelector("ul");
  21. var ul1 = document.getElementById("list");
  22. console.log(ul);
  23. console.log(ul1);
  24. var lis = document.querySelectorAll("ul li");
  25. var lis2 = document.getElementsByClassName("main");
  26. var lis1 = document.getElementsByTagName("li");
  27. console.log(lis);
  28. console.log(lis2);
  29. console.log(lis1);
  30. </script>
  31. </body>
  32. </html>