JavaScript:getElementById-避免代码重复

JavaScript: getElementById - avoiding code duplication

本文关键字：代码 getElementById- JavaScript      更新时间：2023-09-26

我得到了以下代码：

 document.getElementById(this.config.dragArea).addEventListener("dragover", 
  function(e){ e.stopPropagation(); e.preventDefault(); }, false);
 document.getElementById(this.config.dragArea).addEventListener("drop",
  this._dropFiles, false);
//SAME CODE, DIFFERENT IDs
  document.getElementById(this.config.dragAreaMobi).addEventListener("dragover", 
       function(e){ e.stopPropagation(); e.preventDefault(); }, false);
  document.getElementById(this.config.dragAreaMobi).addEventListener("drop",
       this._dropFiles, false);

如果我不想复制所有这些代码，我该怎么办？有没有做document.getElementsById(var1, var2)这样的事情？？（注：dragArea = 'id1'和dragAreaMobi = 'id2'）。

我尝试使用jQuery与：

 $(this.config.dragArea).bind("dragover", function(e){ e.stopPropagation(); e.preventDefault(); }, false);

这个代码不起作用——我最好的猜测是bind和addEventListner之间的区别。。。在这种情况下，dragArea被定义为dragArea = '#id1, #id2'

创建一个函数并将元素传递给函数

function bindEventListeners(elem){
    elem.addEventListener("dragover", function(e){ e.stopPropagation(); e.preventDefault(); }, false);
    elem.addEventListener("drop", this._dropFiles, false);
}
bindEventListeners(document.getElementById(this.config.dragArea));
bindEventListeners(document.getElementById(this.config.dragAreaMobi));
相关文章：