DOM 访问节点

最新推荐文章于 2024-05-23 20:09:14 发布

withdreams

最新推荐文章于 2024-05-23 20:09:14 发布

阅读量907

点赞数 1

分类专栏： DOM 文章标签：文档 html 扩展 xml

本文链接：https://blog.csdn.net/withdreams/article/details/7722361

版权

DOM 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

DOM 是这样规定的：

整个文档是一个文档节点

每个 HTML 标签是一个元素节点

包含在 HTML 元素中的文本是文本节点

每一个 HTML 属性是一个属性节点

注释属于注释节点

查找并访问节点

通过是使用 getElementById() 和 getElementsByTagName() 方法
通过使用一个元素节点的 parentNode、firstChild 以及 lastChild 属性

getElementById() 和 getElementsByTagName() 方法，可查找整个 HTML 文档中的任何 HTML 元素

getElementById()、还可以使用getElementByName()

getElementById()是通过指定元素的ID进行查找

语法：document.getElementById("ID"); //ID是对应控件的ID

getElementById()是通过指定元素的ID进行查找

getElementByName()是通过指定元素的Name进行查找

语法：document.getElementByName("Name"); //Name是对应控件的name属性

getElementsByTagName()

getElementsByTagName()是通过元素的标签进行查找

语法：document.getElementsByTagName("标签名称"); //元素的标签

例如：document.getElementsByTagName("p"); //这个例子会返回文档中所有 <p> 元素的一个节点列表

parentNode、firstChild以及lastChild

<table>
  <tr>
    <td>John</td>
    <td>Doe</td>
    <td>Alaska</td>
  </tr>
</table>
在上面的HTML代码中，第一个 <td> 是 <tr> 元素的首个子元素（firstChild），而最后一个 <td> 是 <tr>元素的最后一个子元素（lastChild）。

此外，<tr> 是每个 <td>元 素的父节点（parentNode）。

对 firstChild 最普遍的用法是访问某个元素的文本：

var x=[a paragraph];
var text=x.firstChild.nodeValue;

parentNode 属性常被用来改变文档的结构。假设您希望从文档中删除带有 id 为 "maindiv" 的节点

var x=document.getElementById("maindiv");
x.parentNode.removeChild(x);

首先，您需要找到带有指定 id 的节点，然后移至其父节点并执行 removeChild() 方法。

根节点

有两种特殊的文档属性可用来访问根节点：
document.documentElement
document.body
第一个属性可返回存在于 XML 以及 HTML 文档中的文档根节点。
第二个属性是对 HTML 页面的特殊扩展，提供了对 <body> 标签的直接访问。

主要用到 document.documentElement.innerText和document.documentElement.InnerHTML

document.body.innerText 和 document.body.InnerHTML

withdreams

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
DOM 访问节点

DOM 是这样规定的：整个文档是一个文档节点每个 HTML 标签是一个元素节点包含在 HTML 元素中的文本是文本节点每一个 HTML 属性是一个属性节点注释属于注释节点查找并访问节点通过是使用 getElementById() 和 getElementsByTagName() 方法通过使用一个元素节点的 parentNode、firstChi
复制链接

扫一扫