添加过多 ID 对 html / js 渲染性能的影响

2023-12-21

我目前正在进行的一个项目大约有 10 个 UL,每个 UL 包含 10-50 个元素。建议每个元素都有一个指定的唯一 ID,我们将使用它通过 Javascript 更新内容。

这看起来需要向页面添加大量 ID,但每个字段都会有一个真实且有意义的名称。

如果这对我们有用,那么在最初渲染页面或使用 JavaScript 遍历/修改页面时,向这么多现有元素添加 ID 是否会对性能产生影响?


根据我个人的经验,我已经实现了具有超过 1000 个唯一 ID 的页面,甚至 IE 似乎也能很好地应对。但是,请记住,IE 将为页面上的每个 ID 创建一个全局变量,并记住在 javascript 中,通常全局变量和函数名称都只是 window 对象的属性。

所以在 IE 中下面的代码将会崩溃:

<div id="foo"></div>
<script>
    function foo (txt) {
        document.getElementById('foo').innerHTML = txt; // fail in IE
                                                        // because function 'foo'
                                                        // clash with ID 'foo'
    }
</script>

只是需要记住一点,因为 ID 数量如此之多,函数名称冲突的机会就会增加。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

添加过多 ID 对 html / js 渲染性能的影响 的相关文章