【www.bbyears.com--jquery】
如:
代码如下 $li.off().find(".file-panel").off().end().remove();都感觉不是很好, 于是果断翻起jQuery的源码, 如下:
代码如下// keepData is for internal use only--do not document
remove: function(selector, keepData) { // selector 为选择器, keepData为是否保留数据
var elem,
elems = selector ? jQuery.filter(selector, this) : this, //如果有选择器则过滤她
i = 0;
for (;
(elem = elems[i]) != null; i++) { //遍历当前选择器下所有数组
if (!keepData && elem.nodeType === 1) { //如果不用保留数据 且 必须为元素
jQuery.cleanData(getAll(elem)); //执行统一清除数据, getAll() 是获取当前元素下所有子元素, 注意的是: 且包含本身
}
if (elem.parentNode) { //她有老大才行
if (keepData && jQuery.contains(elem.ownerDocument, elem)) { //如果要保留数据
setGlobalEval(getAll(elem, "script")); //把js代码保留下来, 不是很明白, 没有细分析
}
elem.parentNode.removeChild(elem); //移除
}
}
return this;
}
empty: function() {
var elem,
i = 0;
for (;
(elem = this[i]) != null; i++) { //遍历当前选择器下所有数组
// Remove element nodes and prevent memory leaks
if (elem.nodeType === 1) { //如果为元素
jQuery.cleanData(getAll(elem, false)); //清除下面所有子的数据, 要注意的是: 这个getAll 方法, 如果第二个参数为 false 则不返回自己, 也就是说只删除子的数据
}
// Remove any remaining nodes
while (elem.firstChild) {
elem.removeChild(elem.firstChild);
}
// If this is a select, ensure that it displays empty (#12336)
// Support: IE<9
if (elem.options && jQuery.nodeName(elem, "select")) {
elem.options.length = 0;
}
}
return this;
}
detach: function(selector) {
return this.remove(selector, true);
}
注: 代码片段取自 jQuery-1.10.2, 这里的数据包括 事件缓存, 数据缓存
经看代码你会现如果想要清空/移除某个元素,只需要 $(ele).remove/empty()即可,不用同志off,find什么, 因为cleanData已经解决了问题, 经看 《js框架设计》 里说 ele.innerHTML = ""; 是用 removeChild的20倍, 但使用jQuery的我们不能这么干,(除非你的元素子里面没有任何数据你可以这么干)
而$.fn.html 设置HTML更为复杂, 过程为:各种正则判断是否为正确的HTML结构, 比如 tbody,td啥的, 并试图修正她, 然后清除里面的数据(类似empty), 并写入html, 这个过程是漫长的
总结
1, 如果要删除dom则直接: $(dom).remove(); 所有事件,缓存一率干掉
2, 如果要清空dom并删除数据: $(dom).empty();
3, 如果只是单纯的改变下简单的html, 可以用: $(dom).empty()[0).innerHTML = "say"; 当然如果你就知道里面没有数据 可以直接 innerHTML, 当然如果是复杂的结构还是建议使用html()
4, 如果要大量操作dom属性,可以这样: var $div = $(dom).remove(); $div.css().attr().data().appendTo(); 事先从dom中删除, 操作大量东东后再插入, 可以相对提高效率
5, 如果只是单纯的删除dom而不删除数据才用 detach