DOM

作者: Wovw | 来源:发表于2020-12-09 15:05 被阅读0次

DOM是Document Object Model(文档对象模型)的简称,它可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构。

W3C中将DOM标准分为3个不同的部分:核心DOM、XML DOM和HTML DOM,其中,核心DOM是针对任何结构化文档的标准模型。

HTML DOM模型被构造为对象的树,根节点是文档(Document)对象,该对象有一个documentElement的属性引用,文档根节点的Element对象是<html>元素,<head>和<body>元素可以看作树的枝干。

图中,每个元素被称为一个节点,直接位于一个节点之下的节点被称为该节点的子节点(childNode),直接位于一个节点之上的节点被称为该节点的父节点(parentNode),具有相同父节点的两个节点称为兄弟节点(siblingNode)。

1.节点的访问

在DOM中,HTML文档的各个节点被视为各种类型的Node对象。如果想要通过某个节点的子节点找到该元素,语法如下:

父节点对象=子节点对象.parentNode;

属性表
2.获取文档中的指定元素

通过遍历节点的访问可以找到文档中指定的元素,但这种方法有些麻烦,document对象中提供了直接搜索文档中指定元素的方法,具体如下。

(1)通过元素的id属性获取元素

Document的getElementById()方法可以通过元素的id属性获取元素。例如,获取id属性值为userId节点的代码如下所示:

document.getElementById("userId");

(2)通过元素的name属性获取元素

Document的getElementByName()方法可以通过元素name属性获取元素。由于多个元素可能有相同的name值,所以该方法返回值为一个数组,而不是一个元素。如果想获得唯一的元素,可以通过获取返回数组中下标值为0的元素进行获取。

例如,获取name值为userName节点的代码如下所示:

document.getElementsByName("userName")[0];

相关文章

  • dom 级别和dom 事件处理

    dom级别:dom0 dom1 dom2 dom3 dom事件处理:dom0 dom2 dom3 (1级DOM标准...

  • WY-DOM编程

    DOM Document Object Model DOM Core DOM HTML DOM Style DOM...

  • DOM事件

    DOM级别与DOM事件 DOM级别:DOM0级、DOM1级、DOM2级、DOM3级DOM事件:DOM0级事件处理、...

  • DOM事件

    DOM级别与DOM事件 DOM级别:DOM0级,DOM1级,DOM2级和DOM3级DOM事件:DOM0级事件处理,...

  • js红包雨活动

    function Block( dom ){ this.dom = dom; //dom this.parentW...

  • DOM操作的分类

    DOM操作分为三个方面,即DOM Core(核心)、HTML-DOM和CSS-DOM。 DOM Core DOM ...

  • 虚拟 DOM 和 diff 算法

    虚拟 DOM(Virtual DOM) 通过 JS 对象表示 DOM 结构,虚拟DOM 是对 DOM 的抽象 通常...

  • jQuery——DOM

    DOM操作分类 一般来说,DOM操作分为3个方面,即DOM Core、HTML-DOM、CSS-DOM。 DOM ...

  • JavaScript高级程序设计前四章

    1. DOM级别 1.1 DOM1级 由DOM核心(DOM Core)和DOM HTML两个模块组成。 DOM核心...

  • DOM分级详解

    DOM1 级(DOM Level 1) DOM1 级由两个模块组成:DOM核心(DOM Core)和DOM HTM...

网友评论

    本文标题:DOM

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