javascript - 在 JS 中创建一个由 native 属性组成的对象构造函数(无 jQuery)

Question

我想知道如何自动设置 DOM 元素中的一组属性。我知道它不是这样工作的，但请参阅代码以了解我的意思:

function interface(bg, color, size, margin, content) {
    this.style.backgroundColor=bg; //native html properties
    this.style.color= last;
    this.style.fontSize = size;
    this.style.marginLeft = margin;
    this.innerHTML=content;
}

var Green = new interface("green", "white", "20px", "20", "the green one");
var Blu = new interface("blue", "white", "48px", "0", "the blue one");

document.getElementById("demo").interface = Green; 

这样就可以应用这组属性，而不必再次一一指向它们。我已经彻底放弃了吗？

Answer 1

Xotic 提供了一个很好的答案，但另一种有趣的方法是让您的函数生成执行该工作的其他函数:

function makeDomUpdater(bg, color, size, margin, content) {
  return function(element){
    element.style.backgroundColor = bg;
    element.style.color = color;
    element.style.fontSize = size;
    element.style.marginLeft = margin;
    element.innerHTML = content;
  };
}

var green = makeDomUpdater("green", "white", "20px", "20", "the green one"),
    blu = makeDomUpdater("blue", "white", "48px", "0", "the blue one");

green(document.getElementById("demo"));

<div id="demo">Demo</div>

这不使用对象构造函数，但话又说回来，并不是所有东西都必须使用。 :)