如何将JavaScript DOM元素(及其整个结构)转换为字符串(不使用jQuery)？..并在页面上重新显示为文本？

Question

我目前正在尝试获取DOM元素(及其整个子元素)并将其存储为字符串,以便我可以在页面上将其重新显示为纯文本.与此类似:

// Get DOM Element
var x = document.getElementById("para1");

// Create a new DOM Element and display x as text on the page
var div = document.createElement('div');
div.textContent = x;
document.body.appendChild(div); 

我期待着我会得到类似的东西<ul><li>One</li><li>Two</li><li>Three</li></ul>; 然而,我得到的是[object HTMLUListElement].

这是小提琴:http://output.jsbin.com/wesosu/1

Answer 1

使用x.outerHTML得到的HTML内容,包括元素本身

var div = document.createElement('div');
div.textContent = x.outerHTML; // x.innerHTML instead if you only want the contents
document.body.appendChild(div);