我如何根据函数中给定的参数将 n 个属性分配给对象？

Question

我正在制作一种更简单的 document.createElement 功能，这就是我目前所拥有的。

function createEl(type, parent) {
    var element = document.createElement(type);
    parent.appendChild(element);
}

我遇到的问题是我不知道如何添加使用 argumments，并且使用参数，您可以将任意数量的属性分配给 element 我在函数内部创建的对象。例如，如果您想添加一个确定 element 的 absolute 风格的。我认为它应该 Object.assign，但我不太确定。

Answer 1

如果我没理解错的话，你的意思是

function createEl(type, parent, optional = {}) {
    var element = document.createElement(type);
    if(optional.sample.lenth)
    {
        // do something with optional.sample
    }
    if(optional.foo.lenth)
    {
        // do something with optional.foo
    }
    parent.appendChild(element);
}

因此您可以在不使用第三个参数 createEl('div','div#id') 或使用对象 createEl('div','div#id',{param:2,foo:'bar'})

的情况下调用它

Answer 2

您可以传递对象，一个用于属性，一个用于样式：

function createEl(type, parent, attributes, style) {
    var element = document.createElement(type);
    //add attributes
    Object.entries(attributes).forEach(([attributeName, attributeValue]) => {
        element.setAttribute(attributeName, attributeValue);
    });
    //add style 
    Object.entries(style).forEach(([styleProp, styleValue]) => {
        console.log(styleProp+ styleValue);
        element.style[styleProp] = styleValue;
    });
    domElement = document.getElementById(parent);
    domElement.appendChild(element);
}

并调用函数：

    const type = "div";
    const parent = "test";
    const attributes = {"id" : "div1" , "class" : "redButton", "..." : "..."};
    const style = {"position" : "absolute", "color" : "green" , "..." : "..."};
    createEl(type, parent, attributes, style);

您可以设置任何类型的属性和样式属性

我如何根据函数中给定的参数将 n 个属性分配给对象？

How would I assign n number of properties to an object depending on the given parameters in a function?

javascript

object

createelement