querySelectorAll in library

querySelectorAll in library

本文关键字：library in querySelectorAll      更新时间：2023-09-26

我有这个代码：

(function (window, document, undefined) {
  var g = function (sel) {
    return {
      selector: document.querySelector(sel),
      on: function (evt, fn) {
        if (this.selector) this.selector.addEventListener(evt, fn, false);
        return this;
      }
    };
  };
  window.g = window._ = g;
})(this, document);

如何在此上下文中使用querySelectorAll而不是querySelector，以便选择多个元素。特别是考虑到将有多种方法，如on。如何循环遍历所有元素并将它们返回到它调用的方法。

selector: document.querySelectorAll(sel),
on: function (evt, fn) {
    if (this.selector) {
        for (var i=0, len=this.selector.length; i < len; i++)
            this.selector[i].addEventListener(evt, fn, false);
    return this;
}

如果您必须在许多方法中重复使用该循环，只需创建一个包装器，类似于

selector: document.querySelectorAll(sel),
forEach: function (codeToApply) {
    for (var i=0, len=this.selector.length; i < len; i++)
            codeToApply.call(this, this.selector[i]);
},
on: function (evt, fn) {
    if (this.selector) {
        this.forEach(function (element) {
            element.addEventListener(evt, fn, false);
        }
    return this;
}
相关文章：