原生JavaScript实现remove()和recover()功能示例
本文实例讲述了原生JavaScript实现remove()和recover()功能。分享给大家供大家参考,具体如下:
利用原生JavaScript实现:
1、remove(selectors)删除指定的一个或一组元素。
2、recover(selectors)恢复刚才删除的元素。
function remove(selectors) {
selectors.removeNode = [];
if (selectors.length != undefined) {
var len = selectors.length;
for (var i = 0; i < len; i++) {
selectors.removeNode.push({
parent: selectors[i].parentNode,
inner: selectors[i].outerHTML,
next: selectors[i].nextSibling
});
}
for (var i = 0; i < len; i++)
selectors[0].parentNode.removeChild(selectors[0]);
}
else {
selectors.removeNode.push({
parent: selectors.parentNode,
inner: selectors.outerHTML,
next: selectors.nextSibling
});
selectors.parentNode.removeChild(selectors);
}
}
function recover(selectors) {
var len = selectors.removeNode.length;
for (var i = 0; i < len; i++) {
var node = selectors.removeNode[i];
if (node.next == null)
node.parent.innerHTML += node.inner;
else {
var div = document.createElement("div");
div.innerHTML = node.inner;
node.parent.insertBefore(div.childNodes[0], node.next);
}
}
}
PS:关于javascript事件说明可参考本站javascript事件与功能说明大全:http://tools.jb51.net/table/javascript_event
更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript事件相关操作与技巧大全》、《JavaScript页面元素操作技巧总结》、《JavaScript操作DOM技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript错误与调试技巧总结》
希望本文所述对大家JavaScript程序设计有所帮助。
相关文章
微信小程序实现action-sheet弹出底部菜单功能【附源码下载】
这篇文章主要介绍了微信小程序实现action-sheet弹出底部菜单功能,结合实例形式分析了action-sheet组件弹出菜单的使用技巧,包括元素遍历、事件响应及属性设置等操作方法,并附带源码供读者下载参考,需要的朋友可以参考下2017-12-12
var let const关键字之间的区别及使用场景示例详解
这篇文章主要为大家介绍了var let const关键字之间的区别及使用场景示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2023-12-12
发两个小东西,ASP/PHP 学习工具。 用JavaScript写的
发两个小东西,ASP/PHP 学习工具。 用JavaScript写的...2007-04-04


最新评论