javascript - $ ("", { value : "thing1", text: "thing2"})); 的 JavaScript 等价物是什么

Question

retVal.push($("<option>", { value: "thing1", text: "thing2" }));

我知道它返回 JQuery<HTMLElement>对象，但我不确定是否有一种不涉及字符串连接的优雅方法。

作为引用，我正在迭代 KeyValuePairs 的对象并动态构建所选 html 元素的选项集合。

编辑:完整的当前代码

ctl.append(ConvertStatusToDropdownItems());
...
var StatusEnum = { "thing1": 0, "thing2": 1, etc. };

function ConvertStatusToDropdownItems() {
var retVal = [];
for (const [key, value] of Object.entries(StatusEnum)) {
    retVal.push($("<option>", { value: value, text: key }));
}
return retVal;
}

就其值(value)而言，从技术上讲，我位于 .Net Core 2.1 站点中的 Typescript 文件中，并且似乎无法获取要加载的 JQuery 的定义。进一步思考，考虑到该函数的全局性质，这样做可能不是一个好主意。

Answer 1

使用 JavaScript，我们可以创建一个辅助函数，帮助我们复制 JQuery 方法的功能。

let create = (tag, opts = {}) => {
  return Object.assign(document.createElement(tag), opts); 
}

let create = (tag, opts = {}) => {
  return Object.assign(document.createElement(tag), opts); 
}

console.log( 
  create("option", { value: "thing1", textContent: "thing2"})  
);

注意普通 DOM 节点上没有 text 属性，只有 textContent。