javascript - 有没有办法根据呈现的字符串创建 DOM 对象？

Question

有没有办法从整个字符串创建 DOM 对象，而不仅仅是 innerHTML？我有一个完整呈现的 DOM 形式的字符串:

<some_tag_name class=... id=...>inner text</some_tag_name>     (1)

并想直接从中创建一个 DOM 对象。我知道有一种方法可以做到:

e = document.createElement("some_tag_name")
e.innerHTML = ...
e.className = ...
e.id = ...

但是当我这样做时，我必须从我拥有的字符串 (1) 中提取 innerhtml 部分，并分析标签类型和所有属性并将其分别分配给 e。我想简单地从我拥有的 (1) 形式的字符串中完成所有这些操作。

编辑

我遵循了答案，但它比一开始看起来更棘手。问题是，当您有一个字符串表示 tr、td 等内容时，您尝试将其作为 innerHTML 放入临时创建的 div ，浏览器会自动在它之外添加额外的标签。以下是我解决此问题的解决方法，其中 c 是字符串，e 是创建的元素:

var cTagName = c.match(new RegExp('[a-zA-Z]+'))[0].toUpperCase();
var e = document.createElement("div");
    e.innerHTML = c;
    e = e.children[0];
//// When the type of `e' does not match what `c' expects, the browser
////    automatically modifies the type of c. The following is to undo this.
if(e.tagName.toUpperCase() != cTagName){
    e = document.createElement("table");
    e.innerHTML = c;
    e = e.children[0];
};
if(e.tagName.toUpperCase() != cTagName){
    e = document.createElement("tbody");
    e.innerHTML = c;
    e = e.children[0];
};
if(e.tagName.toUpperCase() != cTagName){
    e = document.createElement("tr");
    e.innerHTML = c;
    e = e.children[0];
};

Answer 1

你总是可以这样做:

var div = document.createElement("div");
div.innerHTML = "<some> ... </some>"
var e = div.children[0];

(或者如果您使用的是 jQuery，只需 $("<some ... >")[0] )。