在Javascript中，你可以扩展DOM吗？

在JavaScript中，您可以使用其原型对象来扩展现有的类：

String.prototype.getFirstLetter = function() { return this[0]; }; 

是否有可能使用这种方法来扩展DOM元素？

Answer 1

您可以使用元素的原型来扩展DOM。 但是，这在IE7及更早版本中不起作用。 您将需要逐个扩展特定元素。 原型库这样做。 我build议通过源代码来查看它是如何完成的。

Answer 2

当我写这个问题的时候，我find了答案，但是我以为我会发帖分享信息。

您需要扩展的对象是Element.prototype 。

 Element.prototype.getMyId = function() { return this.id; }; 

Answer 3

你不应该直接扩展任何东西（我指的是本地DOM对象），这只会导致不好的事情。 再加上每一个新的元素（你必须做的事情来支持IE）增加了额外的开销。

为什么不采取jQuery的方法，并创build一个包装/构造函数，并扩展它：

 var myDOM = (function(){ var myDOM = function(elems){ return new MyDOMConstruct(elems); }, MyDOMConstruct = function(elems) { this.collection = elems[1] ? Array.prototype.slice.call(elems) : [elems]; return this; }; myDOM.fn = MyDOMConstruct.prototype = { forEach : function(fn) { var elems = this.collection; for (var i = 0, l = elems.length; i < l; i++) { fn( elems[i], i ); } return this; }, addStyles : function(styles) { var elems = this.collection; for (var i = 0, l = elems.length; i < l; i++) { for (var prop in styles) { elems[i].style[prop] = styles[prop]; } } return this; } }; return myDOM; })(); 

然后你可以通过myDOM.fn添加你自己的方法…你可以像这样使用它：

 myDOM(document.getElementsByTagName('*')).forEach(function(elem){ myDOM(elem).addStyles({ color: 'red', backgroundColor : 'blue' }); }); 

Answer 4

是的你可以，但强烈build议不要。

如果你重写的东西另一个库期待成为原来的或另一个库覆盖你所期待的东西..混乱！

将代码保存在自己的名称空间/作用域中是最佳实践。