PDA

View Full Version : DOM Scripting - changing text


hous
08-30-2006, 04:19 PM
Homies,

I'm just getting into using javascript/DOM to change pages w/o refreshes. I wanted to dynamically change the text in a text node by <a onclick>, like so:

javascript:
function scalerSwitch(){
if(switcher==0){
switcher=1;
document.getElementById('scaler').childNodes[0].nodeValue='Δ';
return;
}
if(switcher==1){
switcher=0;
document.getElementById('scaler').childNodes[0].nodeValue='∇';
return;
}
}

html:
<a id="scaler" href="javascript:void(0);" onclick="scalerSwitch();">∇</a>

Here's the kicker: Those symbols are written in ampersand codes in the script (I can't get them to display like that in this post), but when the script changes the text, it displays as ampersand code instead of the symbol!!

Here's a link to the page: http://gadoosh.com/hous/practice/position.htm

_Aerospace_Eng_
08-30-2006, 09:02 PM
I would actually do this differently. Rather than trying to add text, have it on the page already like so
<a id="scaler" href="javascript:void(0);" onMouseOver="wipe();return true;" onclick="scalerSwitch(); changeHeight();"><span id="darrow">∇</span><span id="uarrow" style="display:none">Δ</span></a><!-- <img id="scaler" src="down.gif" alt="" style="margin-left:2px;" /> -->

Then just change the display properties of the appropiate span.
function scalerSwitch()
{
if(switcher == 0)
{
switcher = 1;
document.getElementById('darrow').style.display = 'none';
document.getElementById('uarrow').style.display = 'inline';
return;
}
if(switcher==1)
{
switcher = 0;
document.getElementById('uarrow').style.display = 'none';
document.getElementById('darrow').style.display = 'inline';
return;
}
}

RysChwith
08-31-2006, 08:35 AM
I'm actually going to disagree with Aero on this one; I think you're on the right track. Instead of the HTML entities, though, use the hexadecimal version. You can use this in JavaScript like so:document.getElementById('scaler').childNodes[0].nodeValue='\uXXXX';where XXXX is the hex code for the element in question. The closest I can find in your case are 25b2 (black up arrow) and 25bc (black down arrow), but you can look through the Character Map (assuming you're on a Windows machine) to find the one you want and the associated code.

Rys

hous
08-31-2006, 09:59 AM
Ah. Thanks for the help.