时间戳

首页 > 解决方案 > 不等于性能 JavaScript

javascript - 不等于性能 JavaScript

问题描述

//loop brace start, suppose "i" is counter, will run 20000 times
var spanXId = $('#parentId #demoId'+i).text();
var spanYId = $('#parentId #demoId'+(i+1)).text();
if(spanXId != spanYId){
   //do something
}else{
   //do something
}
//loop brace end

问题在于分配跨度值“ var spanXId = $('#parentId #demoId'+i).text(); ”和 != 比较“ spanXId != spanYId”。这太花时间了。任何想法来解决这个问题？

标签： javascriptjqueryperformance

解决方案

id 属性在您的文档中应该是唯一的，因此$('#parentId #otherid')应该可以用几乎 noop 替换document.getElementById('otherId')。

然后检索 textContent可能需要一些时间，因此您可能会通过缓存先前的值再次获胜：

var spanXId = document.getElementById('demoId0').textContent,
  spanYId = null;
// start your loop from index 1
for(var i=1; i<length; i++) {
  spanYId = document.getElementById('demoId' + i);
  if(spanXId !== spanYId) // do your stuff
  ...
  spanXId = spanYId; // cache for next iteration
}

现在，使用这样的迭代 id 可能根本不是最佳实践，您可能会考虑使用其他选择器，例如类。
然后，您只需在进入循环之前获取 NodeList，并以相同的方式迭代此 NodeList。

var spans = document.querySelectorAll('#parentId .demo');
var spanXId = spans[0].textContent,
  spanYId = null;
// start your loop from index 1
for(var i=1; i<spans.length; i++) {
  spanYId = spans[i].textContent;
  if(spanXId !== spanYId) // do your stuff
  ...
  spanXId = spanYId; // cache for next iteration
}

推荐阅读