javascript - 可以多次调用 document.querySelector( )

Question

如果我的 js 文件中有以下代码行的多个实例:

document.querySelector('#IdName').play(); 
document.querySelector('#IdName').pause();

创建一个函数并向其传递IdName(IdName 会在代码的各个部分中发生变化)是一个好主意吗？我知道它的作用，但我真的很好奇在文件中多次调用 document.querySelector( ) 或将其放入一个我只调用它两次的函数中是否是一个好习惯执行播放和暂停操作。

Answer 1

如果您经常需要相同的元素，请更改函数以获取 DOM 节点，并将元素存储在变量中

function doStuff(elem) {
    elem.play();
}

function stopStuff(elem) {
    elem.pause();
}

var element = document.querySelector('#IdName');

doStuff( element );

// later

stopStuff( element );

这样你只获取元素一次，并避免不必要的 DOM 查找