使用$element.each()时加快DOM访问速度
使用$element.each()时加快DOM访问速度
提问于 2013-02-16 12:46:39
我正试图对我庞大的javascript应用程序进行一些严重的延迟削减。我一直在阅读优化代码的方法，从我学到的一些东西中，我了解到：
- $(元素).each()使事情变得更慢
- 变量(和HTML对象)应该被缓存
这是我在应用程序中经常运行的函数中现有代码的一部分：
if($('.textbox').length > 0)
{ $(".textbox").each(function(){
var parts = $(this).attr('id').split('_');
// do some linear-time operations here with $this
});
});到目前为止，我知道我应该将$this = $(this)放在.each()的开头，并且只使用$(this)。但我还能做什么呢？是否有更快捷的替代方式来使用.each()？我确实需要检查每个div和.textbox类。
回答 2
Stack Overflow用户
回答已采纳
发布于 2013-02-16 12:50:33
但我还能做什么呢？
有几件事：
if语句绝对没有意义(除非它有一个尚未显示的else子句)，因为对空的jQuery对象调用.each是没有操作的。把它移开。- 如果您不想删除它，那么至少要缓存DOM查找的结果，因为每次调用
$('.textbox')jQuery都必须停止并查询DOM。 id是DOM元素实例上的反射属性，因此$(this).attr("id").split('_')包含多个函数调用和通过使用this.id.split('_')可以避免的内存分配。
这就给了我们：
$('.textbox').each(function() {
var parts = this.id.split('_');
// Do something with `parts`
});或者，如果有一个else您还没有显示：
var boxes = $('.textbox');
if (boxes.length) {
boxes.each(function() {
var part s= this.id.split('_');
// ...
});
}
else {
// ...
}Stack Overflow用户
发布于 2013-02-16 12:50:26
您使用的是jQuery，它在后面执行许多代码。最快的方法是原生Javascript。
一个真正的小优化就是从id获得this。您还可以使用这个(原生JS) jQuery执行许多函数)：
var parts = this.id.split('_'); 因此，例如，
尽可能快地获取所有元素。您可以使用此函数按类名获取元素：
if (document.getElementsByClassName == undefined) {
document.getElementsByClassName = function(className)
{
var hasClassName = new RegExp("(?:^|\\s)" + className + "(?:$|\\s)");
var allElements = document.getElementsByTagName("*");
var results = [];
var element;
for (var i = 0; (element = allElements[i]) != null; i++) {
var elementClass = element.className;
if (elementClass && elementClass.indexOf(className) != -1 && hasClassName.test(elementClass))
results.push(element);
}
return results;
}
}以及要循环的代码：
var elements = getElementsByClassName(".textbox");
for(var i=0;i<elements.length;i++)
{
var splitid = elements[i].id.split("_");
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/14910440
复制相关文章
相似问题
腾讯云开发者
