将DOM元素转换为字符串再转换回去是否可能？

Question

我正在获取任何DOM元素（例如document.body），并希望将其转换为字符串，如下所示：

function convert(el){
//should return a String
}

alert(convert(document.body));
//should alert (String) "document.body"
alert(document.getElementById('foo'));
//should alert (String) "document.getElementById('foo')"

我还希望能够将这些字符串转换回来（如果可能的话，不使用 eval()）。例如：

function convertBack(el){
//should return a node
}

convertBack('document.body').innerHTML = 'foo';
//should change the innerHTML of document.body to foo

对于一些人来说，这可能看起来毫无用处，但这是我处理尚不存在的目标元素的方法。我没有使用任何库。

谢谢！

- Ood

---

你真的想要 'document.body' 吗？顺便问一下，你为什么想要它？ - putvande

是的，不是[object HTMLBodyElement]。如果有意义的话，我想以源代码的形式针对DOM元素。 - Ood

如果您包括您的初始问题，可能会有更好/更容易的方法。 - Huangism

这听起来很像一个 X Y 问题。 - Colin DeClue

说实话，有点难。不过，很多 JavaScript 库可以像那样针对 DOM 元素，所以我相信一定有办法。 - Ood

那么，也许你可以提出你想解决的问题，并提供你解决问题的想法？ - Colin DeClue

Answer 1

使用标准的JavaScript，将e作为一个元素：

转换为字符串：

const html = e.outerHTML

转换回元素：

const temp = document.createElement('div') // Can be any element
temp.innerHTML = html
const e = temp.children[0]

使用jQuery非常容易，但我一般不建议使用它。

转换为字符串：

var s = e.outerHTML;

转换回元素：

var e = $(s)[0];

$("<div></div>")解析HTML并返回jQuery对象。您可以使用[0]获取对第一个元素的引用。

- wizulus

---

我没有使用jQuery，但这对某些元素肯定有效。无论如何，谢谢。 - Ood