createTextNode/innerHTML and special character handling

createTextNode/innerHTML and special character handling

Post by Dan Andrew » Wed, 06 Jun 2007 02:09:55


Hello,

I was wondering what is the correct way to handle special characters
via javascript and the DOM. I would like to avoid document.write and
innerHTML. What I am doing is dynamically creating options for a
select. The innerHTML example below works for firefox and internet
explorer, but is this the accepted way of dynamically adding special
characters.

option = document.createElement("OPTION");
// option.appendChild(document.createTextNode("é - example"));
option.innerHTML = "é - example";

Thanks,
Dan Andrews
 
 
 

createTextNode/innerHTML and special character handling

Post by Martin Hon » Wed, 06 Jun 2007 02:18:53


JavaScript supports string literals with Unicode characters so you can
simply use that character in a string literal e.g.
option.appendChild(document.createTextNode('- example'));
Then there is String.fromCharCode e.g.
document.createTextNode(String.fromCharCode(233) + ' - example')
and there are Unicode escape sequences
document.createTextNode('\u00E9 - example')

--

Martin Honnen
http://www.yqcomputer.com/

 
 
 

createTextNode/innerHTML and special character handling

Post by Dark » Wed, 06 Jun 2007 02:28:11


Yes, and createTextNode( "é - ..." ) will create text
"é" visible in the option (which you didn't want, for granted).
What you don't see difference between are the regular text fragments
and xml entities - entities are elements in xml which are recognized
by the famous "&" and ";" delimiters. What you should do is find the
javascript function that can make entities e.g.
document.crea *** tityReference( "eacute" ), but this I had problems
with - got exceptions etc. in some previous work, so I stuck with the
innerHTML property. I think you have to declare the entity first, then
get this reference etc. Anyway, if you get any idea how this works -
share it with us ;-)

Take a look at this, it probably contains the needed information
*somewhere* inside, but I don't have much time at the moment to read
all of it. Good luck:
http://www.yqcomputer.com/
 
 
 

createTextNode/innerHTML and special character handling

Post by Dan Andrew » Wed, 06 Jun 2007 03:40:51


Thanks this is very good to know, however, I don't quite have
literals. I have both entity references and some unicode ("Anhui
\u5b89\u5fbd", "Ñuble",...) in my real situation. The text is
actually coming from a database via an XMLHttpRequest object and the
responseText. I believe these literals are interpreted a bit
differently when they are hard coded as in your '\u00E9 - example'
versus when they are sent across the wire in an XMLHttpRequest, or is
there a way to specify the characterset in an XMLHttpRequest. The
innerHTML is working well if I convert \u5b89 to &#xu5b89;, but I
still would like to avoid innerHTML.

[snip]
request = new XMLHttpRequest();
request.open("GET", "countries?fn=regions&id=" +
countryTypeIdSelected, true);
request.onreadystatechange = function() {
var i;
var array;
var option;
var select = document.getElementById("region");
var cdata;
if (request.readyState == 4) {
array = request.responseText.split(',');
if(array.length>> 1){
for(i=0; i<< array.length - 1; i = i + 2){
option =
document.createElement("OPTION");
option.setAttribute("value", "" +
array[i]);
if(countryTypeIdSelected && countryTypeIdSelected
=== array[i]){
option.setAttribute("selected", "selected");
}
//option.appendChild(document.createTextNode("" +
array[i+1]));
option.innerHTML = "" + array[i+1];
select.appendChild(option);
select.disabled = false;
}
}
[snip]
 
 
 

createTextNode/innerHTML and special character handling

Post by ASM » Wed, 06 Jun 2007 08:09:07

Dan Andrews a rit :

option = new Option(array[i+1],array[i]);
if(countryTypeIdSelected &&
countryTypeIdSelected === array[i])
option.selected = true;
select.options[select.length] = option;
}
select.disabled = false;
}


It is not because you use XMLHttpRequest that old and eficient JS is dead.

--
Stephane Moriaux et son (moins) vieux Mac ddass Stephane Moriaux and his (less) old Mac already out of date