js DOM 获取页面元素

S_xiajinghan

于 2017-07-20 17:51:15 发布

阅读量341

点赞数

CC 4.0 BY-SA版权

分类专栏： JavaScript

本文链接：https://blog.youkuaiyun.com/S_xiajinghan/article/details/75530551

JavaScript 专栏收录该内容

36 篇文章

订阅专栏

本文详细介绍了文档对象模型（DOM）的概念及其API使用方法，包括如何通过不同方式选择和操作HTML元素，如document.getElementById(), document.getElementsByTagName()等，并提供了具体的JavaScript示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

DOM: 文档对象模型，又称为文档树模型，是一套操作HTML和XML文档的API。

DOMCore : 可以用在任何DOM文档中

<head>
   <meta charset="UTF-8">
   <title>Title</title>
   <script>
   
      function handerl() {
          var divs = document.getElementsByTagName("div");
          for (var i = 0; i < divs.length; i++){
              console.log(divs[i]);
              console.log(divs[i].id);
         }
        }

        onclick="handerl(); 相当于
      btn.onclick = function () {//匿名函数
         handerl();
        }  
        
        document.getElementById();//根据id属性获取一个DOM对象。区分大小写，符合代码规范
      document.getElementsByTagName();//根据标签返回多少个DOM对象
      //HTML——DOM 仅仅能够用在HTML文档中 
      document.getElementsByName();
//    HTML5中新增
      document.getElementsByClassName();
   </script>
</head>
<body>
   <p>我是标签</p> 这里面的我是标签的属性名称是innertext;
   <input type="button" value="点我" onclick="handerl();">
   <div id="hhh">ssss</div>
   <div>aaaaa</div>
   <div>bbbbb</div>
</body>
</html>

<p>我是标签</p> 这里面的我是标签的属性名称是innertext;