Question

所以我不想创建一个改变元素样式属性的函数。
我不会这样称呼它：
element.setStyle("display","none");
我可以这样做：

function setStyle(elemnt,attr,val) {
    elemnt.style[attr] =val;
}

有没有办法做到这一点？

Answer 1

您可以在现代浏览器上通过在HTMLElement.prototype上创建功能来执行此操作：

＆＃13;

Object.defineProperty(HTMLElement.prototype, "setStyle", {
  value: function(name, value) {
    this.style[name] = value;
  }
});

document.getElementById("foo").setStyle("color", "green");

＆＃13;

<div id="foo">Hi there</div>

＆＃13;

注意使用Object.defineProperty;只需分配（HTMLElement.prototype.setStyle = function...）就可以在原型上创建一个可枚举的属性，这通常不是一个好主意。

但如果您这样做，只能在您自己的应用/网页代码中执行此操作，而不是（例如）在库代码中执行此操作。每当您的代码在您无法控制的情况下与其他代码结合使用时，请避免扩展内置函数。它要求与其他代码发生冲突。

并且要注意即使您没有将此与任何其他代码相结合，也会定期向DOM添加新方法。例如，如果您在4 - 5年前添加了一个名为closest的方法，那么您现在正在处理一个名为closest的方法已添加到元素的事实接口

Answer 2

这是你要找的吗？

function setStyle(el, key, value) {
   el.style[key] = value;
}

setStyle(document.getElementById("test"), "color", "red");

<div id="test">test</div>

Javascript：为每个HTML元素

2 个答案: