Go Back   Steve Kallestad.com Discussion > Open Discussion > Article Talk


Post New Thread  Reply
 
LinkBack Thread Tools Display Modes
Old 02-07-2007, 06:45 PM   #1
Movable Type Integration
 
Join Date: Feb 2007
Posts: 264
MT Integration is on a distinguished road
Talking Discussion: InnerHTML in IE with the Pre Tag

InnerHTML in IE with the Pre Tag
Quote:
How-to for dealing with the <pre> tag innerHTML property in IE7.
Related On SiteRelated External

None

None
__________________
You're friendly neighborhood automation routine.

Last edited by MT Integration : 08-16-2007 at 02:45 AM. Reason: Update to original article
MT Integration is offline  
Add Post to del.icio.usFurl this Post!
Reply With Quote
Old 10-03-2007, 11:19 AM   #2
Xim
 
 
Cool Re: Discussion: InnerHTML in IE with the Pre Tag

Hello!
I find another way to do this.

if ("innerText" in elem) {
elem.innerText = myPreText;
} else {
elem.innerHTML = myPreText;
}
 
Add Post to del.icio.usFurl this Post!
Reply With Quote
Old 12-13-2007, 03:18 PM   #3
Unregistered
 
 
Default Re: Discussion: InnerHTML in IE with the Pre Tag

if ("innerText" in elem) {
elem.innerText = myPreText;
} else {
elem.innerHTML = myPreText;
}
Does not work properly in Webkit Browsers i.e. Safari, Konqueror etc...
Try
if ("innerText" in elem && "outerHTML" in elem) {
elem.innerText = myPreText;
} else {
elem.innerHTML = myPreText;
}
 
Add Post to del.icio.usFurl this Post!
Reply With Quote
Old 09-29-2008, 02:08 PM   #4
Unregistered
 
 
Post Re: Discussion: InnerHTML in IE with the Pre Tag

I don't like the outerHTML solution, because if you have any properties on your PRE tag (like "id", "class", etc), you have to manually recreate them.
Instead, I do this:
element.innerHTML = newtext;
element.innerText = newtext;
IE supports both properties, but the second one overrides the first and doesn't perform the text normalization, so it looks correct. Browsers that don't support innerText (like Firefox) don't seem to have the same problem with innerHTML, so for them, the first line does the trick and the second does nothing (just sets a property on the element that the browser doesn't care about).
This also has the advantage of working even if the element started out empty -- if you did something like "if (element.innerText) { element.innerText = newtext } ..." this might be a problem.
 
Add Post to del.icio.usFurl this Post!
Reply With Quote
Reply


Thread Tools
Display Modes




All times are GMT -7. The time now is 08:57 PM.