作家
登录

javascript 变态的节点集合

作者: 来源:www.28hudong.com 2013-03-30 01:44:56 阅读 我要评论

节点集合 by 司徒正美 #aaa { padding:10px; border:1px solid red; } p { border:1px solid blue; } 司徒正美 司徒正美 司徒正美 司徒正美 司徒正美 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]如果预先将nodeList转换为数组就没有问题! 复制代码 代码如下: window.onload = function(){ var d = document.createDocumentFragment(); var div = document.getElementById("aaa"); var c = div.childNodes; var arr = []; for(var i=0,n=c.length;i<n;i++){ arr.push(c[i]) } for(var i=0,n=arr.length;i<n;i++){ alert(arr[i] + " "+ i) d.appendChild(arr[i]) } div.parentNode.replaceChild(d,div) } 节点集合 by 司徒正美 #aaa { padding:10px; border:1px solid red; } p { border:1px solid blue; } 司徒正美 司徒正美 司徒正美 司徒正美 司徒正美 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 很显然nodeList还一些奇怪的特性是数组没有的。从运行框2中,我们可以看到把节点appendChild到文档碎片时,其实会把它从DOM树中剥离出来,nodeList一定是跟踪这变化,动态改变了它自身,而直线递加的i是无法对应正确的节点的索引!因此我们每次取得它的firstChild就行了。 复制代码 代码如下: window.onload = function(){ var d = document.createDocumentFragment(); var div = document.getElementById("aaa"); var c = div.childNodes; while(c.length) d.appendChild(c[0])//每次只取它第一个节点,直到取空 div.parentNode.replaceChild(d,div) } 变态的childNodes by 司徒正美 #aaa { padding:10px; border:1px solid red; } p { border:1px solid blue; } 司徒正美 司徒正美 司徒正美 司徒正美 司徒正美 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 顺便一提,由getElementsByTagName取得的HTMLCollection也是这个样子,因此处理这类节点集合要打起十二分精神了! HTMLCollection by 司徒正美 #aaa { padding:10px; border:1px solid red; } p { border:1px solid blue; } 司徒正美 司徒正美 司徒正美 司徒正美 司徒正美 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 这两种节点集合在各浏览器还实现得不太一样,如标准浏览器我们可以用Array.prototype.slice.call将它们转换为原生数组,IE则报错。标准浏览器的它们有hasOwnProperty与valueOf,而IE是没有的……

  推荐阅读

  JavaScript Eval 函数使用

值得注意的 当传入是Json类型的时候要var user = eval(result.d); 当传入是字符串的时候要用eval("exception = "+result.responseText); 复制代码 代码如下:       $.ajax       (       {   >>>详细阅读


本文标题:javascript 变态的节点集合

地址:http://www.17bianji.com/kaifa2/JS/26781.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)