Clever Geek Handbook

How do I compare innerHTML containing a hex character reference?

I have a tag containing & # x25bc; (which is displayed as ▼ on the rendered page):

<span id=up_down>&#x25bc;</span>

The problem is that when I try and compare innerHTML against & # x25bc;

it is instead trying to compare ▼ == & # x25bc; (and failing)

var e = document.getElementById("up_down");
if ( e.innerHTML == '&#x25b2;' )
{
  e.innerHTML = '&#x25bc;';
}
else if ( e.innerHTML == '&#x25bc;' )
{
  e.innerHTML = '&#x25b2;';
}
+3


source to share


3 answers


Try escape()

using it instead of %u25BC

and %u25B2

.

var e = document.getElementById("up_down");
if ( escape(e.innerHTML) == '%u25B2' )
{
  e.innerHTML = '&#x25bc;';
}
else if ( escape(e.innerHTML) == '%u25BC' )
{
  e.innerHTML = '&#x25b2;';
}​


demo

+4


source


Try to compare the character code instead:

if(e.textContent.charCodeA(0) == 0x25bc) {
  // Your code
}


Right now, you are comparing an actual character to a string containing its HTML entity representation.

+1


source


Try something like this:

var upArrow = String.fromCharCode('0x25b2');
var downArrow = String.fromCharCode('0x25bc');

if ( e.innerHTML == upArrow )
{
  e.innerHTML = downArrow;
}
else if ( e.innerHTML == downArrow )
{
  e.innerHTML = upArrow;
}
0


source






More articles: