单行设置 DOM 属性

Question

是否可以将以下内容重写为单个表达式？我喜欢用 vanilla js 编写代码，并希望我的代码不那么冗长const div = document.createElement("div");div.property1 = 1,div.property2 = 2,document.body.appendChild(div);

Answer 1

您可以，但代价是创建另一个对象并通过以下方式循环其属性Object.assign：

document.body.appendChild(Object.assign(document.createElement("div"), {property1: 1, property2: 2}));

带换行符：

document.body.appendChild(

    Object.assign(

        document.createElement("div"),

        {property1: 1, property2: 2}

    )

);

无偿的活生生的例子：;-)

document.body.appendChild(

    Object.assign(

        document.createElement("div"),

        {

            className: "example",

            id: "ex",

            textContent: "Hi there"

        }

    )

);

.example {

    color: green;

}

#ex {

    font-weight: bold;

}

Answer 2

为了兴趣。根据 TJ 的回答，如果使用辅助函数，您的冗长可以少得多：
body.ac(as(ce("div"), { property1: 1, property2: 2 }));