使用Javascript迭代兄弟姐妹的最快方法是什么?

时间:2015-02-28 14:25:18

标签: javascript jquery dom

这样的东西
for (var k = 0; k < $('#somediv > p').length; ++k)
    console.log($('#somediv > p:nth-of-type(' + k.toString() + ')');
由于p元素被多次迭代,因此

不可能有效。实现上述目标的最有效方法是什么?

2 个答案:

答案 0 :(得分:2)

  • $('#somediv > p')存储在变量中,而不是在每个循环回合中重复选择
  • 不要在迭代中使用:nth-of-type( k )。只需一次选择所有这些,然后迭代您得到的集合。

总结:$('#somediv > p')已经为您提供了所需的结果。只需使用jQuery的惯用语each method进行迭代 - 普通的js循环会更快,但这是可以忽略的。

$('#somediv > p').each(function() {
    console.log($(this));
});

当然,如果你寻找原始速度,不要使用jQuery。它可能类似于

var els = document.getElementById("somediv").children;
for (var i=0, l=els.length; i<l; i++)
    if (els[i].tagName == "P")
        console.log(els[i]);

答案 1 :(得分:0)

尝试

var i = 0, p = document.getElementById("somediv").querySelectorAll("p");
do {
  console.log(p[i]);
  ++i;
} while(i < p.length )

&#13;
&#13;
var i = 0, p = document.getElementById("somediv").querySelectorAll("p");
do {
  console.log(p[i]);
  ++i;
} while(i < p.length )
&#13;
<div id="somediv">
  <p>0</p>
    <p>1</p>
    <p>2</p>
    <p>3</p>
    <p>4</p>
  </div>
&#13;
&#13;
&#13;