10.元素节点.html 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839
  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. <div id="div1">
  10. 111111111111111
  11. </div>
  12. <div id="p1">
  13. 2222222222222
  14. </div>
  15. <ul>
  16. <li>1</li>
  17. <li>2</li>
  18. <li>3</li>
  19. </ul>
  20. <script>
  21. var div1 = document.getElementById("div1");
  22. var p1 = document.getElementById("p1");
  23. var uls = document.getElementsByTagName("li");
  24. console.log(div1,p1,uls)
  25. console.log(div1.nodeType);
  26. console.log(p1.nodeType);
  27. console.log(uls[0].nodeType);
  28. // console.log(div1.nextSibling); 下一个元素节点
  29. // previousSibling 上一个元素节点
  30. // previousElementSibling 上一个元素节点内容
  31. // nextElementSibling 下一个元素节点内容
  32. // firstChild 第一个子节点
  33. // lastChild 最后一个子节点
  34. // firstElementChild 第一个子节点元素值
  35. // lastElementChild 最后一个子节点元素值
  36. </script>
  37. </body>
  38. </html>