如何将HTML元素转换为字符串，包括开始和结束标记？

Question

Suppose I have the following HTML element:

<span id='kuku' class='lala bubu' value='xyz'>some text</span>

I know that .html() returns the inner part of the element, ie some text .

How could I get the whole element as string, containing <span>...</span> ?

Answer 1

Most browsers support the element.outerHTML property. You may also want to check out the following Stack Overflow post for an alternative solution (for non IE browsers):

• How do I do OuterHTML in firefox?

Answer 2

Try this:

alert($('#kuku').clone().wrapAll("<div/>").parent().html());

• clones the element you want
• wraps it in a div
• selects the parent (the new div)
• gets the HTML

Answer 3

You can also do it like this :

alert( $('<div>').append( $("#kuku").clone() ).html() );

This one creates an empty div and appends a copy / clone of the element with id kuku to it. It then returns the innerHTML of that previously empty div , which now has in it precisely the HTML you are after.

Answer 4

Simply get the owner of the span. So use the id of the owner/container of the span and use

document.getElementById("urSpanOwnerID").innerHTML