javascript 如何将我自己的方法添加到 HTMLElement 对象？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4670361/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to add my own methods to HTMLElement object?
提问by rsk82
For example for this.parentNodeI would like to just write this.por instead of
document.getElementById('someid')just write document.g('someid'). Of course that are simple examples, I just want to know what is the correct way to do it.
例如，this.parentNode我想只写this.p或而不是
document.getElementById('someid')只写document.g('someid')。当然，这些都是简单的例子，我只想知道正确的做法是什么。
(I know I can use jQuery or Prototype, but I'd like to learn how it is really done in JS)
（我知道我可以使用 jQuery 或 Prototype，但我想了解它是如何在 JS 中真正完成的）
回答by scunliffe
Although you canprototype on the HTMLElementin many browsers - Internet Explorer (6,7,8) is NOTone of them. AFAIK, IE9 does support this (though I haven't tested it).
尽管您可以HTMLElement在许多浏览器上进行原型设计- Internet Explorer (6,7,8)不是其中之一。AFAIK，IE9 确实支持这一点（虽然我还没有测试过）。
For browsers that do handle it, you can do:
对于处理它的浏览器，您可以执行以下操作：
HTMLElement.prototype.doHello = function(thing){
alert('Hello World from ' + thing);
};
回答by Tim Down
I would strongly suggest not attempting to do this, for a few reasons:
我强烈建议不要尝试这样做，原因如下：
- Browser compatibility. While it is possible in several browsers, it isn't possible in IE <= 8.
- DOM elements are host objects. Host objects (i.e. those provided by the environment that aren't native JavaScript objects) have no obligation to play by the same rules as native JavaScript objects and other than specified DOM behaviour can essentially do what they like. So, even if some browsers provide an
HTMLElementprototype and allow you to augment it, there's no guarantee that it will work as you expect. - Compatibility with other code in your page. If any other code in your page (such as Prototype) messes with the
HTMLElementprototype, you risk naming collisions and hard-to-detect bugs.
- 浏览器兼容性。虽然在多个浏览器中是可能的，但在 IE <= 8 中是不可能的。
- DOM 元素是宿主对象。宿主对象（即那些由环境提供的不是原生 JavaScript 对象的对象）没有义务遵循与原生 JavaScript 对象相同的规则，并且除了指定的 DOM 行为基本上可以做他们喜欢的事情。因此，即使某些浏览器提供了
HTMLElement原型并允许您对其进行扩充，也不能保证它会按您的预期工作。 - 与页面中其他代码的兼容性。如果页面中的任何其他代码（例如 Prototype）与
HTMLElement原型混淆，则可能会出现命名冲突和难以检测的错误。
Instead, I would suggest creating wrapper objects around DOM nodes as jQuery, YUI and other libraries do.
相反，我建议像 jQuery、YUI 和其他库一样围绕 DOM 节点创建包装器对象。
Kangax has written a good article on this, covering all these points and more.
回答by user113716
This article from perfectionkills.comwill probably give you some insight into how it's done, and why you shouldn'tdo it.
这从perfectionkills.com文章可能会给你一些洞察到它是如何做的，为什么你不应该这样做。
(By the way, jQuery doesn't extend DOM elements. They use DOM wrappers instead.)
（顺便说一下，jQuery 不扩展 DOM 元素。它们使用 DOM 包装器代替。）
回答by lonesomeday
In a word, don't. It is best not to modify objects you don't own.
总之一句话，不要。最好不要修改您不拥有的对象。
This is particularly true for HTMLElement, which you cannot modify in some browsers.
对于 尤其如此HTMLElement，您无法在某些浏览器中修改它。
