02-HTML DOM 节点

HTML 文档中的所有内容都是节点:

  • 整个文档document是一个文档节点
  • 每个 HTML 元素是元素节点,如<.a href=”#”>超链接</a>
  • HTML 元素内的文本是文本节点,如 超链接
  • 每个 HTML 属性是属性节点 如href=”#”
  • 注释是注释节点

HTML DOM 节点树
Html文档可以看成一课树,比如<HTML>是树的根节点,将 HTML 文档视作树结构。
树中的节点都可以通过js来进行修改,删除 添加等操作

节点之间的关系
拥有层次关系
根节点–顶端的节点 root 他没有父节点
每个节点都有父节点除了根节点
一个节点可以有任意数量的子节点
同胞节点是有相同父节点的节点

比如下面的html文档

<html>   
<head>     
<title>DOM 教程</title>   
</head>   
<body>    
 <h1>DOM 第一课</h1>     
<p>Hello Dopass!</p>   
</body> 
</html>
Code language: HTML, XML (xml)

<HTML>没有父节点,因为他是根节点 root
Html节点有两个子节点 head 和body
Head和body的父节点是html
文本节点”hello dopass”的父节点是 p 注意 标签里面的文本内容也是一个节点
所以 title 节点也有一个子节点 就是文本节点 dom教程
H1和p是同胞节点 有些书叫兄弟节点 同时也是body的子节点
Head是html的第一个子节点 body是最后一个子节点
在js中可以通过 innerhtml或者 innertext属性访问文本节点的值

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注