Создать строку из HTMLDivElement

Question

Что я хотел бы сделать, это создать строку из объекта HTMLElement JavaScript. Например:

var day = document.createElement("div"); 
day.className = "day"; 
day.textContent = "Random Text"; 

Теперь у нас есть создать day HTMLDivElement объект можно ли сделать его напечатать в виде строки? например

<div class="day">Random Text</div> 

Answer 1

Вариант на обертке Gump, так как его реализация поднимает целевой узел из документа.

function nodeToString (node) { 
    var tmpNode = document.createElement("div"); 
    tmpNode.appendChild(node.cloneNode(true)); 
    var str = tmpNode.innerHTML; 
    tmpNode = node = null; // prevent memory leaks in IE 
    return str; 
} 

Чтобы распечатать получившуюся строку на экране (Re: сбежавшего)

var escapedStr = nodeToString(node).replace("<" , "&lt;").replace(">" , "&gt;"); 
outputNode.innerHTML += escapedStr; 

Примечание, атрибуты, как "класс", "ID", и т.д. быть строковой правильно сомнительна.

Answer 2

Почему вы используете createElement, если вы также можете непосредственно разобрать строку? как: var string = '<div class="' + class + '">' + text + '</div>';

Answer 3

Вам нужно создать текстовый узел, чтобы добавить текст для созданного элемента, как это:

var day = document.createElement("div"); 
day.className = "day"; 
// create text node 
var txt = document.createTextNode('Random Text'); 
// add text to div now 
day.appendChild(txt); 
// append to body 
document.body.appendChild(day); 

Answer 4

Вы можете использовать эту функцию (взятую из pure.js)

function outerHTML(node){ 
return node.outerHTML || new XMLSerializer().serializeToString(node); 
} 

Answer 5

Вы можете обернуть этот элемент в другой элемент и использовать innerHTML на нем:

var wrapper = document.createElement("div"); 
wrapper.appendChild(day); 
var str = wrapper.innerHTML;