增删节点
示例代码
创建文本节点
var node = domlib.createTextNode("hello,hudaokeji");
创建元素节点
var node = domlib.createElemnt("div",{
"style" : "width:100%;height:100%"
});
创建节点块
var node = domlib.createFragment("<div><span>label</span><input type='text'/></div>");
追加节点
//将node作为兄弟节点追加到refNode后面 domlib.appendAfter(node,refNode); //将node作为兄弟节点追加到refNode前面 domlib.appendBefor(node,refNode); //将node作为第一个子节点追加到parentNode下面 domlib.appendChildFirst(node,parentNode); //将node作为最后一个子节点追加到parentNode下面 domlib.appendChild(node,parentNode);
清空和删除节点
//清空node的内容 domlib.empty(node); //移除node domlib.remove(node);
工具函数列表
uDOMlib所提供的工具函数之中,有一部分与增删节点相关,下面列出部分函数的源代码实现以供参考。
clone
clone: function(node, deep) {
var self = this, clone, doc;
// TODO: Add feature detection here in the future
if (!isIE || node.nodeType !== 1 || deep) {
return node.cloneNode(deep);
}
doc = self.doc;
// Make a HTML5 safe shallow copy
if (!deep) {
clone = doc.createElement(node.nodeName);
// Copy attribs
each(self.getAttribs(node), function(attr) {
self.setAttrib(clone, attr.nodeName, self.getAttrib(node, attr.nodeName));
});
return clone;
}
return clone.firstChild;
}
createElemnt
createElement : function(tag,props){
var node = document.createElement(tag);
if (props) {
utils.mixin(node,props);
}
return node;
}
createFragment
createFragment: function(html) {
var frag = document.createDocumentFragment(),
node;
if (html) {
fragmentContainer.innerHTML = html;
}
while ((node = fragmentContainer.firstChild)) {
frag.appendChild(node);
}
return frag;
}
createTextNode
createTextNode : function(text){
return document.createTextNode(text);
}
empty
empty : function(node){
while (node.hasChildNodes()) {
var child = node.firstChild;
node.removeChild(child);
}
return this;
}
isChildOf
isChildOf: function(node, parent) {
while (node) {
if (parent === node) {
return true;
}
node = node.parentNode;
}
return false;
}
placeAfter
placeAfter: function(node,refNode){
var parent = refNode.parentNode;
if(parent){
if(parent.lastChild == refNode){
parent.appendChild(node);
}else{
parent.insertBefore(node, refNode.nextSibling);
}
}
return this;
}
placeBefore
placeBefore: function(node,refNode){
var parent = refNode.parentNode;
if(parent){
parent.insertBefore(node, refNode);
}
return this;
}
placeChildFirst
placeChildFirst: function(node,parentNode){
if(parentNode.firstChild){
insertBefore(node, refNode.firstChild);
} else {
parentNode.appendChild(node);
}
return this;
}
placeChild
placeChild: function(node,parentNode){
parentNode.appendChild(node);
return this;
}
remove
remove: function(node){
if(node && node.parentNode){
node.parentNode.removeChild(node);
}
return this;
}
replace
replace: function(node, oldNode) {
oldNode.parentNode.replaceChild(node, oldNode);
return this;
}