1、首先获取要添加的节点的节点,然后创建一个节点,添加到节点的前面。
2、<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>DOM树 *** 作</title> <script> function f1(){。
3、找到狮子狗这个节点 通过id查找到狮子狗节点 var ul=document.getElementById("d1")。
4、</head> <body> <!--在ul列表中追加一个蛮王英雄--> <ul id="d1"> <li>亚索</li> <li>狮子狗</li> <li>披甲龙龟</li>。
5、 </ul> <input type="button" value="追加蛮王" onclick="f2()" /> </body></html>。
6、在狮子狗节点后追加一个<li>蛮王</li> a.找到狮子狗这个节点 通过id查找到狮子狗节点 var li=document.getElementById("l1") b.创建<li>蛮王</li>节点对象和内容。
动态创建Dom节点jQuery中使用$(html字符串)来动态创建Dom节点,并且返回一个jQuery对象,可以调用append等方法将创建的节点添加到Dom中。
例如:
var
link
=
$("<a
href='http://www.baidu.com'>百度</a>")
$("div:first").append(link)
添加节点元素的方法:
Append方法用来在元素的末尾追加元素(最后一个子节点)
Prepend在元素的开始添加元素(第一个子节点)
After:在元素之后添加元素(添加兄弟节点)
Before:在元素之前添加元素(添加兄弟节点)
子元素.appendTo(父元素):在元素的末尾追加一个子元素
子元素.prependTo(父元素):在元素的开始追加一个子元素
A.insertBefore(B)
将A插入到B的前面,等同于B.before(A)
X.insertAfter(B)
将X插入到Y的后面,等同于Y.after(X)
删除节点:
Empty():清空该元素下的所有子节点
等同于:while(ele.firstChild){ele.removeChild(ele.firstChild)}
Remove(selectot)自杀;删除当前元素,返回值为被删除的元素,可以讲节点删除之后放到其他节点下面,有一个移动的效果,例如:
var
lis
=
$("#ulSite
li").remove()
$("#ulSite2").append(lis)
Clone()克隆节点,支复制节点,不复制节点
Clone(true):克隆节点带事件
节点的替换:
$("br").replaceWith("<hr/>")
$("br").replaceAll("<hr/>")
包裹节点
Wrap()方法用来将所有的元素逐个用指定的标签包裹
$("b").wrap("<font
color='red'></font>")将所有粗体字红色显示
wrapInner()在内部围绕
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)