JavaScript教程:document对象和访问标签对象 作者:马育民 • 2021-06-10 22:37 • 阅读:10048 # document 当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model)。 ### document树 HTML DOM 模型被结构化为对象树: [![](http://65242847.gitee.io/pic/js/Snipaste_2021-06-10_22-28-11.png)](http://65242847.gitee.io/pic/js/Snipaste_2021-06-10_22-28-11.png) ### 特点 1. document 管理所有的 HTML 文档内容 2. document 是树型结构,有层级关系 3. 把所有的标签 都 对象化 4. 通过 document **访问所有的标签对象** # 访问标签对象 **注意:** 下面方法 要在页面加载完成之后执行,否则无法获取标签对象 ### getElementById( elementId ) (最常用) 通过标签的 **id 属性** 查找标签 dom 对象 ``` ``` ### getElementsByName( elementName ) 通过标签的 **name 属性** 查找标签 dom 对象 由于 html 标签的 `name` 属性可以同名,所以通过 该方法 返回的是 **数组** ``` ``` ### getElementsByTagName( tagname )(最少用) 通过 **标签名** 查找标签 dom 对象 因为 在html页面中,同名标签太多,所以通过该方法 返回的是 **数组**。并且,很有可能获取一些不想要的标签,所以使用最少 ``` ``` 原文出处:http://malaoshi.top/show_1IX1HsNXg8yt.html