作家
登录

javascript 使用 NodeList需要注意的问题

作者: 来源:www.28hudong.com 2013-03-30 00:09:23 阅读 我要评论

因此,他们始终存着最新,最准确的信息。从本质上说,所有NodeList对象都是访问DOM文档时实时运行的查询。例如下列代码会导致无限的循环: 复制代码 代码如下:<script type="text/javascript"> window.onload=function(){ var divObj=document.getElementsByTagName('div'); for(var i=0;i<divObj.length;i++){ var d=document.createElement("div"); document.body.appendChild(d); } }</script> 首先取得页面中的所有div,由于这个集合(divObj)是“动态的”,因此只要有新的div插入到页面中,divObj都会添加这个新添加的div。也就是说,只要访问divObj,都会重新查询一次,重新更新一下divObj。所以,上面的代码,会出现死循环,因为每次循环的时候都插入了一个新的div,而每次循环都要对条件i<divObj.length求值,意味着会运行取得的所有<div>的查询。 如果想要迭代一个NodeList,最好是使用length属性初始化第二个变量,然后将迭代器与该变量比较。如下代码所示: 复制代码 代码如下:<script type="text/javascript"> window.onload=function(){ var divObj=document.getElementsByTagName('div'); for(var i=0,len=divObj.length;i<len;i++){ var d=document.createElement("div"); document.body.appendChild(d); } }</script>这个例子中初始化了第二个变量(len)。由于len中保存着对divObj.length的在循环开始时的一个快照,因此就会避免上个例子的死循环。 总结:一般来说,应该尽量减少访问NodeList的次数。因为每次访问NodeList,都会运行一基于文档的查询。所以,可以考虑将从NodeList中取到的值缓存起来,如例子二所示!

  推荐阅读

  jQuery Deferred和Promise创建响应式应用程序详细介绍

这篇文章,我们一起探索一下 JavaScript 中的 Deferred 和 Promise 的概念,它们是 JavaScript 工具包(如Dojo和MochiKit)中非常重要的一个功能,最近也首次亮相于 流行的 JavaScript 库 jQuery(已经是1.5版本的>>>详细阅读


本文标题:javascript 使用 NodeList需要注意的问题

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

关键词: 探索发现

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

网友点评
自媒体专栏

评论

热度

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