DDR爱好者之家

javascript 使用 NodeList需要注意的问题
站长资源 2025/1/22 佚名
29 1538
DDR爱好者之家 Design By 杰米

因此，他们始终存着最新，最准确的信息。从本质上说，所有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中取到的值缓存起来，如例子二所示！

DDR爱好者之家 Design By 杰米
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
DDR爱好者之家 Design By 杰米
ddrfans.com DDR爱好者之家
8,675无损音乐
1,324高清电影
213破解软件
70,141收录资讯

更新日志

友情链接

杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网
DDR爱好者之家 Design By 杰米