/* dom的插入,移除,克隆 domo(‘dom0‘).clone() */ !(function (w) { w.domoperation = function (id) { var _class = new dom(); _class.init(id); return _class; }; w.dom = function () { }; w.dom.prototype = { getid: function (id) { return document.getElementById(id) }, parseDom: function (arg) { var objE = document.createElement("div"); objE.innerHTML = arg; return objE.childNodes; }, init: function (id) { this.Selector = [document.getElementById(id)]; }, getdom: function () { return this.Selector[0] ? this.Selector[0] : null; }, append: function (html) { var dom = this.parseDom(html), getdom = this.getdom(); for (var i = 0, j = dom.length; i < j; i++) { getdom.appendChild(dom[0]); } }, appendTo: function (id) { this.getid(id).appendChild(this.getdom()); }, prepend: function (html) { var dom = this.parseDom(html), getdom = this.getdom(); var first = getdom.firstChild; for (var i = 0, j = dom.length; i < j; i++) { getdom.insertBefore(dom[0], first); } }, prependTo: function (id) { var _indom = this.getid(id); _indom.insertBefore(this.getdom(), _indom.firstChild); }, after: function (html) { var dom = this.parseDom(html), getdom = this.getdom(); if (getdom.parentNode.lastChild == getdom) { for (var i = 0, j = dom.length; i < j; i++) { getdom.appendChild(dom[0]); } } else { var nextSibling = getdom.nextSibling; for (var i = 0, j = dom.length; i < j; i++) { getdom.parentNode.insertBefore(dom[0], nextSibling); } } }, before: function (html) { var dom = this.parseDom(html), getdom = this.getdom(); for (var i = 0, j = dom.length; i < j; i++) { getdom.parentNode.insertBefore(dom[0], getdom); } }, remove: function () { this.getdom().parentNode.removeChild(this.getdom()); }, clone: function (id) { var _jiedian = this.getdom().cloneNode(true); _jiedian.removeAttribute("id"); return _jiedian; } } w.domo = w.domoperation; })(window);
<!DOCTYPE html> <html> <head> <meta content="width =device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport" /> <meta content="yes" name="apple-mobile-web-app-capable" /> <meta content="black" name="apple-mobile-web-app-status-bar-style" /> <meta content="telephone =no" name="format-detection" /> <title>dom操作</title> <script src="/Script/Dom.js"></script> <style type="text/css"> * { padding: 0px; margin: 0px; } </style> </head> <body> <div id="dom0"><span id="span">abc</span> dom0</div> <div id="dom1">dom1</div> <script type="text/javascript"> var dom0 = document.getElementById(‘dom0‘); document.getElementById(‘span‘).onclick = function () { alert("abc"); }; alert(domo(‘dom0‘).clone().outerHTML); //getid(‘dom0‘).remove(); //getid(‘dom1‘).append("<span style=‘color:red‘>span</span><div>def</div>") </script> </body> </html>
时间: 2024-10-09 05:43:15