Javascript：多次运行函数时出现神秘的滞后

发布于 2024-09-08 06:53:03 字数 410 浏览 3 评论 0原文

以下函数仅返回文档中具有指定标记名的元素。由于某种原因，在连续调用该函数时，它的执行变得越来越慢。我已经彻底测试了它以及原因中的 for-loop 行，但我不明白为什么这会导致连续调用变慢。

function getElementsByTagName2(tagName){
    var arr=new Array();
    var elems=document.getElementsByTagName(tagName);
    for(var i=0, len=elems.length; i!=len; arr.push(elems[i++]));
    return arr
}

编辑：更改变量名称以取悦 user257493。

EDIT1：刚刚测试了 jQuery，它也有同样的问题。但退化程度很小。

原文

The following function simply returns an of elements with the specified tagname in the document. For some reason on successive calls to the function the execution of it gets slower and slower.. I have tested it thoroughly and the for-loop line in the cause, but I don't understand why that would cause a slow down on successive calls.

function getElementsByTagName2(tagName){
    var arr=new Array();
    var elems=document.getElementsByTagName(tagName);
    for(var i=0, len=elems.length; i!=len; arr.push(elems[i++]));
    return arr
}

EDIT: Changed variable names to please user257493.

EDIT1: Just tested jQuery and it has the same issue. The degradation is minor though.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

巴黎盛开的樱花 2024-09-15 06:53:03

我已经测试了你的代码，它似乎运行得很好。

我的结果（迭代 -> 花费的时间（找到的 div）：

1. Firefox：
0-> 1524（已找到 102）
1-> 1534（已找到 102）
2-> 1518（已找到 102）
3-> 1528（已找到 102）
4-> 1535（已找到 102）
...
15-> 1513（已找到 102）
16-> 1512（已找到 102）
17-> 1513（已找到 102）
18-> 1513（已找到 102）
19-> 1518（发现 102）

2。 Chrome：
0-> 387（已找到 102）
1-> 283（已找到 102）
2-> 268（已找到 102）
3-> 272（已找到 102）
4-> 271（已找到 102）
...
15-> 270（已找到 102）
16-> 279（已找到 102）
17-> 267（已找到 102）
18-> 287（已找到 102）
19-> 272（已找到 102）

回复收藏 0 原文

人事已非 2024-09-15 06:53:03

函数运行之间发生了什么？ DOM 如何变化？由于返回元素数量增加，每个过程花费的时间逐渐变长的可能性有多大？另外，推送速度很慢。这也有效，并且可能会加快你的速度 - 我在重复执行中没有显示任何延迟。

function getElementsByTagName2(tagName) { 
  var arr = new Array(), 
  elems = document.getElementsByTagName(tagName); 
  for (var i = 0, len = elems.length; i != len; arr[i] = elems[i], ++i); 
  return arr; 
}

What goes on between the runs of your function? How does the DOM change? What's the likelihood that each takes successively longer because you've got an increased number of return elements? Also, push is slow. This also works and might speed you up a bit - I show no delays in repeated executions.

function getElementsByTagName2(tagName) { 
  var arr = new Array(), 
  elems = document.getElementsByTagName(tagName); 
  for (var i = 0, len = elems.length; i != len; arr[i] = elems[i], ++i); 
  return arr; 
}

回复收藏 0 原文

猫弦 2024-09-15 06:53:03

尝试直接分配数组元素，而不使用推送。

function getElementsByTagName2(tag, pa){
    pa= pa || document;
    tag= pa.getElementsByTagName(tag);
    var L= tag.length, A= [];
    while(L){
        A[--L]= tag[L];
    }
    return A
}
getElementsByTagName2('*',document.body)

Try to assign the array elements directly, without push.

function getElementsByTagName2(tag, pa){
    pa= pa || document;
    tag= pa.getElementsByTagName(tag);
    var L= tag.length, A= [];
    while(L){
        A[--L]= tag[L];
    }
    return A
}
getElementsByTagName2('*',document.body)

回复收藏 0 原文

夜深人未静 2024-09-15 06:53:03

Prototype to-array 方法是否也有同样的问题？

function $A(iterable) {
  if (!iterable) return [];
  if ('toArray' in Object(iterable)) return iterable.toArray();
  var length = iterable.length || 0, results = new Array(length);
  while (length--) results[length] = iterable[length];
  return results;
}

Does the Prototype to-array method have the same problem?

function $A(iterable) {
  if (!iterable) return [];
  if ('toArray' in Object(iterable)) return iterable.toArray();
  var length = iterable.length || 0, results = new Array(length);
  while (length--) results[length] = iterable[length];
  return results;
}

回复收藏 0 原文

~没有更多了~