减少JavaScript中的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，以避免潜在的内存泄漏。