<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
body, table{font-family: 微软雅黑; font-size: 10pt}
table{border-collapse: collapse; border: solid gray; border-width: 2px 0 2px 0;}
th{border: 1px solid gray; padding: 4px; background-color: #DDD;}
td{border: 1px solid gray; padding: 4px;}
tr:nth-child(2n){background-color: #f8f8f8;}
</style>
</head>
<body>
<div>
<div><span style="font-size: medium; "><span style="font-weight: bold; ">Document Object Model </span> (document--->html 文档--->dom树) </span><span style="color: rgb(0, 0, 255); font-size: small; ">//方便开发者 前端工程师 去控制 更改 页面元素。自动用代码去控制页面元素。</span>
</div>
<div><span style="color: rgb(0, 0, 255); font-size: small; ">
<div>是W3C织制订的一套用于访问XML和HTML文档的标准.允许脚本动态地访问和更新文档的内容、结构和样式.
</div></span>
</div>
<div><span style="font-size: medium; "><span style="font-weight: bold; ">分类:</span>xml dom + html dom (+</span>DOM Core<span style="font-size: medium; ">)</span>
</div>
<div><span style="font-size: medium; "><br /></span>
</div>
<div><span style="font-size: medium; font-weight: bold; ">xml 介绍 </span>
</div>
<div><span style="font-size: medium; font-weight: bold; ">
<table style="font-family: 微软雅黑; font-size: 10pt; border-collapse: collapse; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: gray; border-right-color: gray; border-bottom-color: gray; border-left-color: gray; border-width: initial; border-top-width: 2px; border-right-width: 0px; border-bottom-width: 2px; border-left-width: 0px; table-layout: fixed; word-break: break-all; width: 620px; empty-cells: show; margin-left: 0px; background-color: rgb(234, 242, 211); ">
<tbody>
<tr>
<td style="border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: gray; border-right-color: gray; border-bottom-color: gray; border-left-color: gray; padding-top: 4px; padding-right: 4px; padding-bottom: 4px; padding-left: 4px; ">
<div><span style="font-weight: normal; "><school></span>
</div>
<div><span style="font-weight: normal; ">   <class></span>
</div>
<div><span style="font-weight: normal; "> <student>zs</student></span>
</div>
<div><span style="font-weight: normal; "> <student>zs</student></span>
</div>
<div><span style="font-weight: normal; "> <student>zs</student></span>
</div>
<div><span style="font-weight: normal; "> </class></span>
</div>
<div><span style="font-weight: normal; ">
<div> <class>
</div>
<div> <student>zs</student>
</div>
<div> <student>zs</student>
</div>
<div> <student>zs</student>
</div>
<div> </class>
</div></span>
</div>
<div><span style="font-weight: normal; "></school></span>
</div>
</td>
</tr>
</tbody>
</table><br /></span>
</div>
<div><span style="font-size: medium; "> </span><img src="https://img-blog.csdnimg.cn/2022010615073584402.png" /><span style="font-size: medium; ">   </span>
</div>
<div><span style="font-size: medium; "><img src="https://img-blog.csdnimg.cn/2022010615073513497.png" /></span>
</div>
<div><span style="font-size: medium; "><br /></span>
</div>
<div><span style="font-size: medium; "><br /></span>
</div>
<div><span style="font-size: medium; "><br /></span>
</div>
<div><span style="font-size: medium; ">
<div>
<h3>节点信息
</h3>
<p>每个节点都拥有包含着关于节点某些信息的属性。这些属性是:
</p>
<ul>
<li>nodeName(节点名称)
</li>
<li>nodeValue(节点值)
</li>
<li>nodeType(节点类型)
</li>
</ul>
</div>
<div>
<h3>nodeName
</h3>
<p>nodeName属性含有节点的名称。
</p>
<ul>
<li>元素节点的nodeName是标签名称
</li>
<li>属性节点的nodeName是属性名称
</li>
<li>文本节点的nodeName永远是#text
</li>
<li>文档节点的nodeName永远是#document
</li>
</ul>
<p class="note"><span>注释:</span>nodeName所包含的XML元素的标签名称永远是大写的。
</p>
</div>
<div>
<h3>nodeValue
</h3>
<p>对于文本节点,nodeValue属性包含文本。
</p>
<p>对于属性节点,nodeValue属性包含属性值。
</p>
<p>nodeValue属性对于文档节点和元素节点是不可用的。
</p>
</div>
<div>
<h3>nodeType
</h3>
<p>nodeType属性可返回节点的类型。
</p>
<h4>最重要的节点类型是:
</h4>
<table class="dataintable">
<tbody>
<tr>
<th>元素类型
</th>
<th>节点类型
</th>
</tr>
<tr>
<td>元素
</td>
<td>1
</td>
</tr>
<tr>
<td>属性
</td>
<td>2
</td>
</tr>
<tr>
<td>文本
</td>
<td>3
</td>
</tr>
<tr>
<td>注释
</td>
<td>8
</td>
</tr>
<tr>
<td>文档
</td>
<td>9
</td>
</tr>
</tbody>
</table>
</div></span>
</div>
<div><span style="font-size: medium; "><br /></span>
</div>
<div><span style="font-size: medium; "><br /></span>
</div>
<div><span style="font-size: medium; ">
<h3>
<dl>
<dt><span style="color: #0000ff">取得某个元素的值</span>
</dt>
<dd>本例使用getElementsByTagname()方法来取得"books.xml"中<span style="color: #ff0000">所有</span>"title"元素的值。
</dd>
<dt><span style="color: #0000ff">取得某个属性的值</span>
</dt>
<dd>本例使用getAttribute()方法来取得"books.xml"中<span style="color: #ff0000">所有</span>"category"属性的值。
</dd>
<dt><span style="color: #0000ff">取得某个项目的值</span>
</dt>
<dd>本例使用getNamedItem()方法来取得"books.xml"中<span style="color: #ff0000">所有</span>"category"属性的值。
</dd>
</dl>
</h3></span>
</div>
<div><span style="font-size: medium; "><br /></span>
</div>
<div><span style="font-size: medium; "><br /></span>
</div>
<div><span style="font-size: medium; "><br /></span>
</div>
</div>
</body>
</html>