//定义一个xml对象
var x = $("<xml><items><center /></items></xml>")
//在 center节点的结尾添加一个 bottom节点 ，然后在center节点的开头添加一个top节点
x.find("center").appendXml("<bottom />").prependXml("<top />")
//在 center节点的后面添加一个after节点，然后在center节点的前面添加一个before节点
x.find("center").afterXml("<after />").beforeXml("<before />")
alert(x.xml())
})
(function($) {
function mnpXml(opCode, xmlStr) {
return this.each(function() {
if (typeof xmlStr != "string") return
if (!jQuery.isXMLDoc(this)) return
var node = $.parseXml(xmlStr).firstChild.cloneNode(true)
switch (opCode) {
case "append":
this.appendChild(node)
break
case "prepend":
if (this.childNodes.length > 0)
this.insertBefore(node, this.firstChild)
else
this.appendChild(node)
break
case "after":
if (this.nextSibling)
this.parentNode.insertBefore(node, this.nextSibling)
else
this.parentNode.appendChild(node)
break
case "before":
this.parentNode.insertBefore(node, this)
break
}
})
}
$.fn.extend({
appendXml: function(s) {
return mnpXml.call(this, "append", s)
},
prependXml: function(s) {
return mnpXml.call(this, "prepend", s)
},
afterXml: function(s) {
return mnpXml.call(this, "after", s)
},
beforeXml: function(s) {
return mnpXml.call(this, "before", s)
},
xml: function() {
var elem = this[0]
return elem.xml || (new XMLSerializer()).serializeToString(elem)
},
innerXml: function() {
var s = this.xml()
var i = s.indexOf(">"), j = s.lastIndexOf("<")
if (j > i)
return s.substring(i + 1, j)
else
return ""
}
})
$.extend(jQuery, {
parseXml: function(xmlStr) {
if (window.ActiveXObject) {
var xd = new ActiveXObject("Microsoft.XMLDOM")
xd.async = false
xd.loadXML(xmlStr)
return xd
}
else if (typeof DOMParser != "undefined") {
var xd = new DOMParser().parseFromString(xmlStr, "text/xml")
return xd
}
else return null
},
toXml: function(obj, nodeName, useAttr) {
var x = $($.parseXml("<" + nodeName + " />"))
var n = x.find(":first")
for (var p in obj) {
if (useAttr)
n.attr(p, obj[p])
else
n.appendXml("<" + p + " />").find(p).text(obj[p])
}
return x[0]
}
})
})(jQuery)
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>节点对象和内容。
父节点要和添加子节点差不多，但你要把父节点放在什么地方，例如放在body:
var ele=$('<div>子节点</div>')var ele1=$('<div>父节点</div>')
$(ele1).append(ele)//把子节点放在父节点里
$(document.body).append(ele1)//把父节点放在body里
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）