Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Problems using the pre tag with innerHTML

Status
Not open for further replies.
tango1948

tango1948

Programmer
Dec 23, 2006
111
IL
Hi,
I'm having problems outputing preformatted text using the <pre> tag with innerHTML - the output is incorrectly formated - using the <pre> tag on the same text without innerHTML works fine.
Anyone know of any problems or solutions for using <pre> with innerHTML.
Thanks for any help


David
 
Sort by date Sort by votes
There is no problem settnig the innerHTML of PRE elements. Take this:

Code: 
<html>
<head>
	<style type="text/css">
		div {
			border: 1px solid #CC0000;
			margin-bottom: 10px;
		}
	</style>

	<script type="text/javascript">

		window.onload = populateDivs;

		function populateDivs() {
			document.getElementById('div2').innerHTML = document.getElementById('div1').innerHTML;
			document.getElementById('div3').innerHTML = '<pre>\n\t\t\tThe cat\n\n\n\n\t\t\tsat on           the\n\n\t\t\t\tmat\n\t\t</pre>';
		}

	</script>
</head>

<body>

	<div id="div1">
		<pre>
			The cat



			sat on           the

				mat
		</pre>
	</div>

	<div id="div2">
	</div>

	<div id="div3">
	</div>
</body>
</html>

The first DIV contains a PRE that is hard-coded. The second gets its contents from the first, and the third is set using purely JS.

In both IE 6 and Fx 2, they all look identical (and correct) to me... So perhaps it's something else in your code / styling?

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
Upvote 0 Downvote
Post your JavaScript. I imagine the problem lies in real returns and tabs in quotes instead of the escape chars that Billy Ray used above... but we won't know exactly the problem until we see the code you're using.

[plug=shameless]
[/plug]
 
Upvote 0 Downvote
Perhaps it's worth David trying to fix his issue based on my code above, and taking it over to forum216 if it's now turning into more of a JS problem than an HTML one?

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

scorney
  • Locked
  • Question
background image with overlay which Hover when over a specific Area/Form
Replies
1
Views
697
3esolar
3
lmcate
  • Locked
  • Question
From HTML Page open an MDB files on the server and work
Replies
0
Views
203
lmcate
lmcate
jizzer
  • Locked
  • Question
HTML/CSS Image map with multiple tool-tips
Replies
3
Views
1K
spamjim
spamjim
198709km
  • Locked
  • Question
Grouping XML key value using XSLT
Replies
0
Views
610
198709km
198709km
Mike Lewis
  • Locked
  • Question
How to refresh a Javascript file in the browser's cache?
Replies
4
Views
1K
Mike Lewis
Mike Lewis

Part and Inventory Search

Sponsor

Back
Top