当前位置:   article > 正文

JavaScript获取元素的几种方法_在javascript如何通过css选择器获取页面元素的集合

在javascript如何通过css选择器获取页面元素的集合

getElementById()方法:通过元素的ID获取元素。这个方法是最常用的方法。

  1. <div id="myDiv">Hello World!</div>
  2. <script>
  3. const divElement = document.getElementById("myDiv");
  4. </script>

  1.  

 getElementsByClassName()方法:通过类名获取元素。这个方法将返回一个元素数组。

  1. <div class="myClass">Hello World!</div>
  2. <script>
  3. const divElements = document.getElementsByClassName("myClass");
  4. </script>

  1.  

getElementsByTagName()方法:通过标签名获取元素。这个方法将返回一个元素数组。 

  1. <div>Hello World!</div>
  2. <script>
  3. const divElements = document.getElementsByTagName("div");
  4. </script>

querySelector()方法:通过CSS选择器获取元素。这个方法将返回一个元素

  1. <div class="myClass">Hello World!</div>
  2. <script>
  3. const divElement = document.querySelector(".myClass");
  4. </script>

querySelectorAll()方法:通过CSS选择器获取元素。这个方法将返回一个元素数组

  1. <div class="myClass">Hello World!</div>
  2. <p class="myClass">Hello World!</p>
  3. <script>
  4. const elements = document.querySelectorAll(".myClass");
  5. </script>

需要注意的是,除了getElementById()方法,其他方法都会返回元素的数组。如果你只想获取一个元素,可以使用数组的索引来获取。例如:const firstDiv = divElements[0];

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/你好赵伟/article/detail/226614
推荐阅读
相关标签
  

闽ICP备14008679号