javascript 如何通过原型添加Nodelist/HtmlCollection新方法？

k4emjkb1 于 2023-01-01 发布在 Java

关注(0)|答案(2)|浏览(175)

document.querySelectorAll('a')和document.getElementsByTagName('a')的类型都是Object，所以我为什么不能用这种方式添加方法：

Object.prototype.method = function(){ alert(this); }

但是，这项工作：

a = document.getElementsByTagName('a');
        a.__proto__.__proto__.method = function(){ alert(this); }
        a.method();//object HTMLCollection

我以为是a.__proto__ == a.constructor.prototype，对吧？

2条答案

使用Object.prototype是可能的，但是我不建议把它弄乱。
instance_of_my_object = document.getElementsByTagName('a');是对象的单个示例。在本例中，instance_of_my_object是节点列表。

**instance_of_my_object.method = ...**将您的方法或变量附加到NodeList的单个示例。

如果你想把某个方法附加到一个类的所有示例上，那么你可以使用prototype（如下所示：类名.原型.我的方法=函数（）...）。

我发现这在我的案例中非常有用：

NodeList.prototype.toArray = function() {
  return Array.prototype.slice.call(this);
};

这两个示例都显示了如何在本例中向NodeList添加方法，以及如何将它们转换为旧的简单数组，并具有concat、foreach等数组选项。
您也可以对HTMLCollection做同样的操作。玩得开心：）