outerHTML decoded special caracteres

louvinon · Jan 23, 2009

Hi,

I use the function outerHTML in order to get the html of a div.
But specials caracteres are decoded.

For example :
when I click on the button "Show" , I obtain :

<DIV id=example val='test with & $B!l(B < " > '>test with & < "
></DIV>

If you compare the html code (see below) with the value of the
attribute 'val', you can see it's different. < becomes <, >
becomes > ...
How can I do to get exactly the same code ?

Thanks.

Code:

<html><head>
<title>SOS</title>
<script>
function show() {
alert(document.getElementById("example").outerHTML);
}
</script>
</head><body>
<div id="example" val="test with &amp; &prime; &lt; &quot; &gt;
">test with &amp; &lt; &quot; &gt;</div>
<button onclick="show()">SHOW</button>

</body>
</html>

Evertjan. · Jan 23, 2009

wrote on 23 jan 2009 in comp.lang.javascript:

I use the function outerHTML in order to get the html of a div.
But specials caracteres are decoded.

For example :
when I click on the button "Show" , I obtain :

<DIV id=example val='test with & $B!l(B < " > '>test with &
< " ></DIV>

If you compare the html code (see below) with the value of the
attribute 'val', you can see it's different. < becomes <, >
becomes > ...
How can I do to get exactly the same code ?

You cannot,
as the sourcecode is not available to the DOM,
and only the DOM is the source of the outerHTML.

Thomas 'PointedEars' Lahn · Jan 23, 2009

I use the function outerHTML in order to get the html of a div.
But specials caracteres are decoded.

No, mostly they are read as they should be in the document tree. HTML
parsing makes `&' out of `&', `<' out of `<' aso. in the document
tree. The `innerHTML' and `outerHTML' properties are supposed to be
serializations of (parts of) that data structure.

For example :
when I click on the button "Show" , I obtain :

<DIV id=example val='test with & â€² < " > '>test with & < "
></DIV>

Looks like a combination of a bug and a font issue. `&' should have
been `&', and â€² is probably not display properly because the font used for
window.alert() does not provide this character. Or, it is an encoding
issue (see below).

If you compare the html code (see below) with the value of the
attribute 'val', you can see it's different. < becomes <, >
becomes > ...
How can I do to get exactly the same code ?

Don't use outerHTML (or innerHTML, for that matter).

Code:

<html><head>[/QUOTE]

The declaration of the default encoding as per the
`meta[http-equiv="Content-Type"]' element is missing.  If the Content-Type
HTTP header is also missing or if it lacks a `charset' parameter, the
document output is the result of browser's guesswork.  Always declare your
encoding.

[QUOTE]
<title>SOS</title>
<script>[/QUOTE]

The required `type' attribute is missing.
[QUOTE]
function show() {
alert(document.getElementById("example").outerHTML); 
window.alert(...);

}
</script>
</head><body>
<div id="example" val="test with &amp; &prime; &lt; &quot; &gt;
">test with &amp; &lt; &quot; &gt;</div>[/QUOTE]

DIV elements don't have a `val' attribute.  Your markup is not Valid, so you
should not expect anything.

[QUOTE]
<button onclick="show()">SHOW</button>[/QUOTE]

<input type="button" value="SHOW" onclick="show()">

suffices here, although precautions should be taken for user agents that do
not support client-side scripting.

Help with code	0	Jun 12, 2022
Uhhhhh, What can I do next?	6	Nov 25, 2023
Check forms With JavaScript	1	Mar 28, 2023
How do I hide the modal after 5 seconds?	4	Jun 1, 2023
Working on mobile css menu with plenty of frustration!	2	Dec 29, 2022
Can't execute php to delete multiple rows in database	3	May 14, 2023
I want to Display Excel As HTML In js	2	Feb 24, 2023
How to position the tooltip comment on these buttons?	9	Nov 4, 2023

outerHTML decoded special caracteres

louvinon

Evertjan.

Thomas 'PointedEars' Lahn

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads