Javascript 减少在同一HTML元素上使用getElementById的次数

在将同一元素传递给多次调用的函数的情况下，将该元素存储为全局变量是否更有效

例如，您有一个函数，该函数被称为“每个向下键”，并接受button的参数

<input type="button" onkeydown="func1(document.getElementById('menu')" />
<div id="menu">
Dynamic text here
</div>

这样做更好吗

var div//global variable
function func1()
{
  if(div === null)
  {
    div = document.getElementById('menu')
  }
  ...//rest of code
}

并用

还是全局变量总是一件坏事

将元素存储为全局变量是否更有效

---

严格地说，答案是肯定的。您正在保存函数调用。但在实践中，这种差异可能是可以忽略不计的。

全局变量对于大型项目来说是危险的，您将无法控制这些变量，冲突的可能性更大，等等。。。对于您的问题，您可以创建一个对象来保存有关某些函数的缓存，这样您就可以使用较少的全局变量，并以最佳方式组织代码。全局变量需要适度使用=D

您可以添加元素作为函数的属性，如下所示：

function func1()
{
  console.log(func1.element);
}

func1.element = document.getElementById('menu');

func1();

您还可以检查该元素是否存在于函数中：

function func1()
{
  if(func1.element == undefined) {
    func1.element = document.getElementById('menu'); 
  }

    console.log(func1.element);
}

func1();

---

这将使您远离全局变量，并且仍然保留缓存元素的好处。

您必须问一个问题，“为什么我需要它更高效？”如果计算机只是坐在那里等待有人键入或移动鼠标，为什么不使用CPU来运行一些Javascript。我想每秒10个键是一个合理的上限，所以你有100毫秒的时间来处理每个键而不会出现问题。如果它导致屏幕上的对象痛苦地闪烁，那么它可能是值得的。不过，通常有比存储元素id更好的优化方法。您对全局变量犹豫不决是正确的。但是缓存DOM元素是一个很好的实践。您仍然可以缓存它，但只需确保在闭包中这样做，以便它不是全局元素。名称空间，名称空间，名称空间！实际上，您不应该使用内联事件处理程序。如果连接处理程序，则不再需要全局变量programatically@Eric什么是内联事件处理程序？您已经在示例中缓存了它。您正在将其缓存到

div

。我只是在我的评论中明确地帮助澄清。通过缓存，我的意思是存储它，以便下次需要时不必进行额外的DOM查找。您能举一个例子说明这样一个对象的缓存外观吗？

function func1()
{
  if(func1.element == undefined) {
    func1.element = document.getElementById('menu'); 
  }

    console.log(func1.element);
}

func1();