我们如何使用javascript将HTML字符串转换为Object？

Question

我有一个像这样的Html字符串：

<div id="foo">
    <h1 class="greeting">Hello World!</h1>
</div>

我需要在Javascript中将此html字符串转换为Object。即，在jquery中使用.children()方法时，我应该得到相同的对象结果。我试过这样的事情：

a = '<div id="foo">
    <h1 class="greeting">Hello World!</h1>
</div>';
eval("{"+a+"}");
console.log(a);

但它没有用。我应该在javascript中使用什么方法将HTML字符串转换为Object符号。我应该以对象形式获取每个子节点。我不想在这个解决方案中使用Jquery。我期待控制台

中显示的确切输出

Answer 1

在图像中，它是一个jQuery对象，您可以使用以下代码

创建它

var a = '<div id="foo">\
    <h1 class="greeting">Hello World!</h1>\
</div>';
var aDom = jQuery(a);
console.log(aDom );

纯JavaScript：jsfiddle

var e = document.createElement("div");
e.id = "foo";
e.innerHTML = '<h1 class="greeting">Hello World!</h1>';

console.log(e);

Answer 2

被修改

var a = '<div id="test"></div>';

var htmlObject = document.createElement('div');

htmlObject.innerHTML = a;

htmlObject.getElementById("test") = data;

Answer 3

你想这样吗

<script>
var htmlStrObj = {};
htmlStrObj.container = '<div id="foo"><h1 class="greeting">Hello World!</h1></div>';
console.log(htmlStrObj);
</script>