优化jquery循环以设置宽度

时间:2011-03-03 19:14:46

标签: javascript jquery optimization width overflow

我正在尝试使用设置溢出和修复宽度的策略来停止扩展超出其可变大小父div的大小的div中的字符串。我在页面上有大约4400个dom元素(不能减少,通常可以更多),但只需要更改大约100-300。当然,FF / Webkit中的问题不会在不到一秒的时间内完成,但IE在超过7秒时非常慢。

我已经通过使用一组预先确定的id元素来消除任何dom遍历,以解决相关标签。有没有我缺少的东西,或者在较短的时间内为IE做一些替代技巧?

for (id in ids) {
    jq("#" + ids[id] + "_name").css({"overflow": "hidden",
        'width': jq("#" + ids[id]).innerWidth() - 1
    });
}

2 个答案:

答案 0 :(得分:2)

好吧,在直到DOM的金属并且仍然没有消除任何速度的时候,我已经选择了减轻问题的替代方案,因此对于用户来说这不是一个问题(也许是IE9)将MS从这种尴尬中拯救出来!)。我看了this blog entry by Nick Fitzgerald,它展示了克服这个问题的技巧。所以在这里,使用Nick的模式,最终是我的解决方案(只是处理IE的部分,我按原样离开了非IE版本):

yieldingEach(ids, function(namebox) {
    var elemName = document.getElementById(namebox + '_name');
    if (elemName) {
        var elem = document.getElementById(namebox);
        elemName.style.width = (elem.scrollWidth - 4) + 'px';
    }
});

答案 1 :(得分:0)

这是一个非jQuery版本...验证它在IE中有效,但它会稍微快一些,因为你没有让jQuery为你做这件事。

for (id in ids) {
    var elemName = document.getElementById(ids[id] + '_name'),
        elem = document.getElementById(ids[id]);

    elemName.setAttribute('overflow', 'hidden');
    elemName.setAttribute('width', elem.innerWidth - 1);
}