javascript 增强DOM元素节点的原型?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4193769/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 10:39:26  来源:igfitidea点击:

Augmenting the prototype of DOM element nodes?

javascriptdomprototype

提问by ?ime Vidas

I know how to add new methods to every object - by augmenting the Object's prototype:

我知道如何为每个对象添加新方法——通过增加对象的原型:

Object.prototype.foo = function() {  }; 

But, is it possible to define new methods for DOM element nodes only? Do DOM element node objects have a prototype? Or is there maybe a prototype for DOM nodes in general?

但是,是否可以只为 DOM 元素节点定义新方法?DOM 元素节点对象有原型吗?或者是否有一般的 DOM 节点原型?

Or do prototype objects only exist for built-in objects?

还是原型对象只存在于内置对象中?

回答by Andy E

Yes, but not in all browsers. Internet Explorer 8 supports DOM prototypes (to a certain extent), as do Firefox, Chrome, Opera and Safari.

是的,但并非在所有浏览器中。Internet Explorer 8 支持 DOM 原型(在一定程度上),Firefox、Chrome、Opera 和 Safari 也是如此。

HTMLElement.prototype.toggle = function () { 
    this.style.display = this.style.display == 'none' ? '' : 'none';
}

Many consider it bad practice to extend DOM objects via their prototype. Kangax has a great article on the subject: http://perfectionkills.com/whats-wrong-with-extending-the-dom/. However, DOM prototypes allow us to implement standards-based methods in environments that don't support them yet, much like shims for ECMAScript 5th Edition methods.

许多人认为通过它们的原型扩展 DOM 对象是不好的做法。Kangax 有一篇关于这个主题的很棒的文章:http://perfectkills.com/whats-wrong-with-extending-the-dom/ 。然而,DOM 原型允许我们在尚不支持它们的环境中实现基于标准的方法,就像 ECMAScript 第 5 版方法的垫片一样。

回答by Tim Down

In some browsers, DOM elements do expose a prototype object, which may also inherit from Object.prototype, but this is not universally true (for example, IE does not). In general, host objects such as DOM elements are not obliged to do this; in fact, host objects are not bound by many of the rules that apply to native JavaScript objects, so you should never rely on DOM elements to support this kind of thing.

在某些浏览器中,DOM 元素确实公开了一个原型对象,该对象也可能继承自Object.prototype,但这并非普遍适用(例如,IE 没有)。通常,宿主对象(例如 DOM 元素)没有义务这样做;事实上,宿主对象不受适用于原生 JavaScript 对象的许多规则的约束,所以你永远不应该依赖 DOM 元素来支持这种事情。

I recommend kangax's excellent article on this subject.

我推荐kangax 关于这个主题的优秀文章

回答by BGerrissen

That's exactly what prototype.jsdoes, but is now considered extremely bad practise. It's much better to use wrappers/handlers. Note, augmenting ANY native objects, especially the Objectobject, is bad practise.

这正是prototype.js所做的,但现在被认为是非常糟糕的做法。使用包装器/处理程序要好得多。请注意,增加任何本机对象,尤其是Object对象,都是不好的做法。

read:

读:

Whats wrong with extending the DOM
Object.prototype is verboten

扩展 DOM Object.prototype 有什么问题
是禁止的

Addendum:

附录:

Whilst extending native objects in small projects it can be considered safeit will actually become an extremely bad habbit. It's only marginally less worse then littering the global scope with functions and variables. Not only do name collisions occur, but also implementation collisions. This will become more apearant the more libraries you mash up.

虽然在小项目中扩展原生对象可以被认为是安全的,但实际上它会变成一个非常糟糕的习惯。它只是稍微比在全局范围内乱扔函数和变量更糟糕。不仅会发生名称冲突,还会发生实现冲突。您混搭的库越多,这将变得更加清晰。

Keeping your implementation on your own objects is the only way to avoid ANY collisions, name, implementation or otherwise.

将您的实现保持在您自己的对象上是避免任何冲突、名称、实现或其他方式的唯一方法。

All that said, it's your perogative to do as you please, I however will not recommend anything thats widely accepted as sheer bad practise. I stick to my recommendation.

综上所述,您可以随心所欲地做事,但是我不会推荐任何被广泛接受的纯粹不良做法。我坚持我的建议。