使用Javascript遍歷兄弟姐妹的最快方法是什么？

Question

就像是

for (var k = 0; k < $('#somediv > p').length; ++k)
    console.log($('#somediv > p:nth-of-type(' + k.toString() + ')');

由於p元素需要多次迭代，因此效率可能不高。 最有效的方法是什么？

Answer 1

• 將$('#somediv > p')在變量中，而不是在每次循環轉彎時都重復選擇
• 不要在迭代中使用:nth-of-type( k ) 。 只需一次選擇所有這些，然后迭代您得到的集合。

總結： $('#somediv > p')確實已經為您提供了想要的結果。 只需使用jQuery慣用的each方法來遍歷它-普通的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]);

Answer 2

嘗試

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

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

 <div id="somediv"> <p>0</p> <p>1</p> <p>2</p> <p>3</p> <p>4</p> </div>