有没有纯JavaScript的方法类似于jQuery的$.fn.extend？

Question

在jQuery中，我这样做：

$.fn.extend({
   hello: function() {console.log(this + ' says hello world.')}
});

然后。

$('div').hello();

我能否只使用纯Javascript实现这个功能，而不必加载整个jQuery库？

- Such Much Code

---

可能是Javascript对象扩展 -的重复问题。 - kosmos

“我能否在纯JavaScript中完成这个操作，而不必为此加载整个jQuery库？” — 是的。查看jQuery的源代码，看看他们是如何实现的。 - Quentin

Answer 1

技术上来说，你可以这样做：

function extendingQuerySelector(selector, extension) {
    var el = document.querySelector(selector);
    for(var key in extension) {
        if(extension.hasOwnProperty(key)) {
            el[key] = extension[key];
        }
    }
    return el;
}

尽管扩展基本的DOM对象似乎不是一个好主意。这里没有jQuery包装器，但你当然可以制作这样的包装器。

- ralh

Answer 2

在JavaScript中，您可以通过连接到HTML元素本地函数的原型来扩展选择器函数。例如，对于您的问题，我将使用以下代码：

HTMLDivElement.prototype.hello = function()
  {
    console.log(this+" says hello world.");
  }
document.querySelector('div').hello()

对于锚点元素，我会这样做：

：

HTMLAnchorElement.prototype.my_func=function()
  {
    console.log(this.nodeName);
  }
document.querySelector("a").my_func()

以上代码将在浏览器控制台中打印所选锚点元素的节点名称。您可以使用纯Javascript探索其他HTML选择器函数。

https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement

- Jagdish Bharathi