HTML DOM Element

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了HTML DOM Element相关的知识,希望对你有一定的参考价值。

html DOM Element(元素)
文档本身是文档节点 .
所有 HTML 元素是元素节点 .
所有 HTML 属性是属性节点
HTML 元素内的文本是文本节点 .
注释是注释节点 .

NODE的用法

1.如需向 HTML DOM 添加新元素,您首先必须创建该元素,然后把它追加到已有的元素上。
创建新的 HTML 元素 使用appendChild()

appendChild()实例如下:

<div id="div1">
<p id="p1">我是一</p>
<p id="p2">我不二</p>
</div>Html代码

JS代码:
var para=document.createElement("p");
这段代码创建了一个新的 <p> 元素:

var node=document.createTextNode("我是三");
向p元素添加文本,必须创建文本节点。这段代码创建文本节点

para.appendChild(node);
向已有元素追加这个新元素

var element=document.getElementById("div1");
查找已有的元素

element.appendChild(para);
向已存在的元素增加新元素

2.删除已有的节点:removeChild()
实例如下:
<dl id="dl1">
<dd id="dl4">我</dd>
<dd id="dl3">要</dd>
<dd id="dl2">加</dd>
</dl>
首先要找到要被删除节点的父节点
var ul=document.getElementById("dl1");

然后选中要被删除的节点
var li=document.getElementById("dl4")

最后就是执行删除
ul.removeChild(li)

上述代码就会删除dd标签。

3.替换元素:replaceChild(新节点,旧节点)
实例如下:
<div id="div1">
<p id="p1">诸葛</p>
<p id="p2">孔明</p>
<p id="p3">关羽</p>
<p id="p4">云长</p>
</div>
var para=document.createElement("p");
var node=document.createTextNode("卧龙");
para.appendChild(node);
var parent=document.getElementById("div1");
var child=document.getElementById("p2");
parent.replaceChild(para,child);
替换指定元素首先还是要建立新的节点
然后再找到它的父节点
最后执行转换replaceChild(para,child)括号里面的值一次是新建的节点和需要替换的节点

以上是关于HTML DOM Element的主要内容,如果未能解决你的问题,请参考以下文章

【求助】Dom4j 生成xml,节点增加属性时,属性值中有特殊字符,如何做到不转义

并发修改异常:添加到 ArrayList

如何结合 flexbox 顺序和 nth-child(odd)

JavaScript之DOM-9 HTML DOM(HTML DOM概述常用HTML DOM对象HTML表单)

pdftron font

Spring事务解析2-标签解析