资讯专栏INFORMATION COLUMN

JavaScript - DOM - Document对象

Jason_Geng / 2674人阅读

摘要:对象时继承与的对象是继承于继承于定位页面元素对象提供了属性和方法实现页面元素定位功能,这也是规范中对象的主要应用之一。

如何在HTML使用JavaScript

DOM DOM是什么

DOM是Document Object Model的缩写,译为文档对象模型

DOM是一个独立于任何语言和平台的接口,允许任何语言或者脚本动态的访问和更新HTML文档的内容、- 结构和样式。该HTML页面会进一步处理,并且该处理的结果可以被合并到呈现的HTML页面中。

DOM被设计用于解析HTML页面文档,方便JavaScript语言通过DOM访问和操作HTML页面中的内容。

Document对象 Document对象是什么

Document对象时DOM中标准规范中比较重要的对象之一,该对象提供了访问和更新HTML页面内容的属性和方法。Document对象提供的属性和方法,可以实现定位HTML页面中的元素,或者创建新的元素等功能。




    
    Title




document对象的继承链

Document对象是继承于Node对象的,Node对象也是DOM标准规范中非常重要而的对象之一,Node对象又是继承于EventTarge对象。




    
    Title




定位页面元素

Document对象提供了属性和方法实现页面元素定位功能,这也是DOM规范中Document对象的主要应用之一。
Document对象提供实现页面元素定位的方法具有以下几种:

getElementById()方法:通过页面元素的id属性值定位元素

getElementsByName()方法:通过页面的name属性定位元素

getElementsByTagName()方法:通过页面元素的元素名定位元素

getElementsByClassName()方法:通过页面元素的class属性值定位元素

querySelector()方法:通过CSS选择器定位第一个匹配的元素

querySelectorAll()方法:通过CSS选择器定位所有匹配的元素

getElementById()方法

由于id属性是唯一的,所以通过这种方法定位的HTML元素也是唯一的




getElementsByName()方法





getElementsByGayName()方法





getElementsByClassName()方法




CSS选择器定位元素







节点集合NodeList

NodeList是一组元素节点的集合,每个节点具有索引值(从0开始,类似于数组),分为动态和静态两种

动态NodeList:如果文档中的节点树发生变化,则已存在的NodeList对象也发生变变化

getElementsByByName
getElementsByTagName
getElementsByClassName

静态NodeList:文档对象模型的任何改变都不会影响集合的内容







定位页面的元素属性

Document对象提供了一些属性,定位HTML页面的比较特殊的元素








创建也变元素 创建元素节点

Document对象提供了createElement()方法创建元素节点



创建文本节点

Document对象提供了createTextNode()方法创建文本节点



创建属性节点

Document对象提供了createAtrribute()方法创建属性节点



文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/97101.html

相关文章

  • 初识DOM

    摘要:标识,就是将页面解析为一个文档。标识,就是中表示各个对象之间的关系。的标准由于的标准规范是由组织起草并定义的,所以对的定义是目前最权威的解释。兄弟关系具有相同父级元素的两个或几个元素之间的兄弟关系。是返回值,表示定位元素的集合,是一个集合。 如何使用JavaScript script元素 元素 元素用于在HTML页面中嵌入或引入JavaScript脚本代码。该元素默认被定义在元素中。t...

    史占广 评论0 收藏0
  • 初识DOM

    摘要:标识,就是将页面解析为一个文档。标识,就是中表示各个对象之间的关系。的标准由于的标准规范是由组织起草并定义的,所以对的定义是目前最权威的解释。兄弟关系具有相同父级元素的两个或几个元素之间的兄弟关系。是返回值,表示定位元素的集合,是一个集合。 如何使用JavaScript script元素 元素 元素用于在HTML页面中嵌入或引入JavaScript脚本代码。该元素默认被定义在元素中。t...

    qpal 评论0 收藏0
  • 初识DOM

    摘要:标识,就是将页面解析为一个文档。标识,就是中表示各个对象之间的关系。的标准由于的标准规范是由组织起草并定义的,所以对的定义是目前最权威的解释。兄弟关系具有相同父级元素的两个或几个元素之间的兄弟关系。是返回值,表示定位元素的集合,是一个集合。 如何使用JavaScript script元素 元素 元素用于在HTML页面中嵌入或引入JavaScript脚本代码。该元素默认被定义在元素中。t...

    Coding01 评论0 收藏0
  • 谈谈浏览器里的JavaScript

    摘要:而与最大的区别在于与浏览器沟通的窗口,不涉及网页内容。完全依赖于浏览器厂商实作本身无标准规范,而有着所制定的标准来规范。而透过选取出来的节点,我们可以通过操作属性来变更它的文字。在许多的网页前端教学或是文章书籍当中,你可能常常听到这样的说法:「HTML、CSS 与JavaScript 是网页前端三大要素」,其中: HTML 负责资料与结构 CSS 负责样式与呈现 JavaScript 负责...

    CastlePeaK 评论0 收藏0
  • 原生JS操作DOM

    摘要:能够改变页面中的所有元素能够改变页面中的所有属性能够改变页面中的所有样式能够对页面中的所有事件做出反应我们需要通过操作元素,查找这些元素有三种方法通过查找通过标签名查找通过类名查找允许改变元素的内容。,如使有能力对事件做出反应。 通过html dom可以访问javascript html文档的所有元素。当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Mo...

    anRui 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<