I
was having an issue with the javascript innerText property today. I was
to lazy to convert the legacy code that I was working on to use proper
DOM so I did some reading on the issue.
Turns out that FireFox doesn't use innerText at all. Apparently the
proper DOM property to use is textContent. textContent does basically
the same thing as innerText.
A not so pretty solution to this issue is to check at the start of
the script whether the browser supports innerText or textContent. I
found a few resources that allowed me to copy and paste a few lines to
make everything work.
This one which I found on coderlab
is a little bulky but it gets the job done. It checks which property is
available and then forces the programmer to check that flag every time
he wants to use the property.
var hasInnerText =
(document.getElementsByTagName("body")[0].innerText
!= undefined) ? true : false;
var elem = document.getElementById('id');
if(!hasInnerText){
elem.textContent = value;
} else{
elem.innerText = value;
}
This is the method I actually used. I just or'd the two different
properties together and it seemed to work. I guess one will always be
undefined.
var message = elem.innerText || elem.textContent;
At least FireFox is following the standards unlike Internet Explorer
which always needs special css and javascript. Making everything work
in Internet Explorer always adds hours onto development time...
|