JavaScript的DOM节点

作者: 木丿灬易 | 来源:发表于2019-07-14 01:57 被阅读48次

浏览器会根据DOM模型,将结构化文档(比如HTML和XML)解析成一系列的节点,再由这些节点组成一个树状结构

(DOMTree)。所有的节点和最终的树状结构,都有规范的对外接口。

JavaScript是一门编程语言,而DOM是浏览器对HTML文档结构化后的一个模型;

严格地说,DOM不属于JavaScript,但是我们最常用的就是使用JavaScript操作DOM;

JavaScript的DOM节点

DOM的最小组成单位叫做节点(node)。文档的树形结构(DOM树),就是由各种不同类型的节点组成。

每个节点都可以看作是文档树的一片叶子。

最顶层的节点就是document节点,它代表了整个文档;是文档的根节点。

每张网页都有自己的document节点,window.document属性就指向这个节点的。

只要浏览器开始载入HTML文档,这个节点对象就存在了,可以直接调用。

每一个HTML标签元素,在DOM树上都会转化成一个Element节点对象;

文档里面最高一层一般是HTML标签,其他HTML标签节点都是它的下级。

除了根节点以外,其他节点对于周围的节点都存在三种关系:

父节点关系(parentNode):直接的那个上级节点

子节点关系(childNodes):直接的下级节点

同级节点关系(sibling):拥有同一个父节点的节点

常用dom操作:

查找页面的标签元素

标签增加、修改、删除等操作

标签的属性相关操作

给标签元素绑定事件(设置当什么什么时候,做什么什么事情)

相关文章

  • DOM (javascript DOM节点操作)

    DOM (javascript DOM节点操作) 本节目录 查找DOM元素 DOM节点操作 javascript操...

  • 前端面试题总结(算法)

    javascript递归遍历所有DOM文档节点 javascript递归遍历所有DOM文档节点 HTTP 方法:G...

  • jQuery-DOM篇

    DOM创建节点及节点属性 通过JavaScript可以很方便的获取DOM节点,从而进行一系列的DOM操作。但实际上...

  • JavaScript基础与DOM

    JavaScript基础与DOM 键盘按下与松开 图片轮播 xml Dom 节点信息: 每个节点都有包含关于节点某...

  • 【前端】-029-DOM编程-节点操作

    节点的属性 节点操作 除了通过DOM树中的父子、兄弟关系获取节点外,还可以通过 JavaScript 中的DOM接...

  • JavaScript DOM常用操作

    JavaScript的DOM操作主要包括: 更新:更新该DOM节点的内容,相当于更新了该DOM节点表示的HTML的...

  • 一篇文章教会你如何将DOM转换为virtual DOM

    【一、Virtual DOM简介】 Virtual DOM是虚拟节点,它通过Javascript的Object对象...

  • jQuery基础——DOM篇

    第1章 简介 第2章 DOM节点的创建 2-1 DOM创建节点及节点属性 通过JavaScript可以很方便的获...

  • JavaScript DOM操作(一)

    javascript-节点属性详解 根据 DOM,HTML 文档中的每个成分都是一个节点。 DOM 是这样规定的:...

  • DOM 重点核心

    文档对象类型:DOM1,对于JavaScript ,dom接口2,对于Html, dom 树包括文档,元素,节点...

网友评论

    本文标题:JavaScript的DOM节点

    本文链接:https://www.haomeiwen.com/subject/asivkctx.html