InnerHTML issue with IE8, Chrome, Opera - RESOLVED!
Posted: Sun Jan 31, 2010 3:31 pm
Call off the dogs! As soon as I saw the code highlighted here, I realized that I had omitted a closing single-quote in the span style tag! Sorry.
That cleared up all the browsers except Opera, which still displays the raw HTML. Any insights there??
Sheesh! That was just a caching issue. Opera's OK now, too! I think I need to take a break!
I am trying to replace the innerHTML attribute of a <div>, and it contains a couple of HTML tags, namely <br /> and <span>. This works fine in Firefox, but produces different results in IE8, Chrome, Opera and Safari. I assume that I'm not using correct syntax, but FF is lax about enforcing whatever rule I'm breaking. I've tried to research it and find that there was an acknowledged bug in IE5 on just this issue, but Microsoft's workaround doesn't seem to work for me, either.
Here are the pertinent code fragments:I have used alert() to show that the txtscore variable holds precisely the code that I want (also, it works fine in FF, as I said).
Results:
That cleared up all the browsers except Opera, which still displays the raw HTML. Any insights there??
Sheesh! That was just a caching issue. Opera's OK now, too! I think I need to take a break!
I am trying to replace the innerHTML attribute of a <div>, and it contains a couple of HTML tags, namely <br /> and <span>. This works fine in Firefox, but produces different results in IE8, Chrome, Opera and Safari. I assume that I'm not using correct syntax, but FF is lax about enforcing whatever rule I'm breaking. I've tried to research it and find that there was an acknowledged bug in IE5 on just this issue, but Microsoft's workaround doesn't seem to work for me, either.
Here are the pertinent code fragments:
Code: Select all
var txtscore = " Your score is <br ><span style='font-size:24pt; font-style:bold;>";
txtscore += Math.floor(totscore);
txtscore += "</span>";
document.getElementById('score').innerHTML = txtscore;Code: Select all
<div id='score' class='box'><!-- --></div>- Firefox: the box shows:
Code: Select all
Your score is [size=150] [b]33[/b][/size] - IE8: only "Your score is" is displayed.
- Chrome: same as IE8.
- Safari: same as IE8.
- Opera: displays the raw HTML:
Code: Select all
Your score is <span style='font-size:24pt; font-style:bold;>50