碎片时间学编程「367]：最小化 DOM 访问

DOM 操作（包括访问 DOM）通常很慢。

这通常不是问题，除非您必须执行许多 DOM 操作并且 JavaScript 应用程序的性能开始受到影响。

如果您打算多次访问 DOM 元素或其值，那么提高性能的一个非常快速的技巧就是将它们存储在局部变量中。

//这种操作很慢，它多次访问 DOM 元素document.querySelector('#my-element').classList.add('my-class');document.querySelector('#my-element').textContent = 'hello';document.querySelector('#my-element').hidden = false;// 以下方式速度较快，它将 DOM 元素存储在变量中const myElement = document.querySelector('#my-element');myElement.classList.add('my-class');myElement.textContent = 'hello';myElement.hidden = false;

请注意，虽然这个技巧可能会派上用场，但它需要注意的是，如果您稍后删除 DOM 元素并且仍然将其存储在变量中，则应将该变量设置为 null 以避免潜在的内存泄漏。

更多内容请访问：https://www.icoderoad.com