why does document.write go on new page [Archive]

tenniskid493

02-16-2006, 04:48 PM

Help.

I have a program where in one of my functions...I have a document.write statement. However, when I call this function...It puts the new font onto a new page. How can I get it to go onto the same page.

Here's a simplified example of my code.
<html>

<head>
<link rel="stylesheet" type="text/css" href="stylesheet.css"></link>
<script type="text/javascript">
function attack()
{
document.write("Hello")
}
</script>
<title>Choose Spell Test Layout</title>
</head>
<body bgcolor="#000000" text="#FFFFFF">
<img src="http://i24.photobucket.com/albums/c25/tenniskid493/statbackground.jpg" border="0" height="125" width="570" name="statbackground" id="statbackground" class="statbackground">
<h4 name='name1' id='name1' class='name1'>Name: Garet</h4>
<h4 name="element1" id="element1" class="element1">Element: Fire</h4>
<h4 name="level1" id="level1" class="level1">Level: 25</h4>
<h4 name="health1" id="health1" class="health1">Health: 500</h4>
<h4 name="magic1" id="magic1" class="magic1">Magic: 275</h4>
<h4 name="name2" id="name2" class="name2">Name: Enemy</h4>
<h4 name="element2" id="element2" class="element2">Element: Water</h4>
<h4 name="level2" id="level2" class="level2">Level: 18</h4>
<h4 name="health2" id="health2" class="health2">Health: 375</h4>
<h4 name="magic2" id="magic2" class="magic2">Magic: 180</h4>
<img src="http://i24.photobucket.com/albums/c25/tenniskid493/attack.gif" class="attackbutton" onclick="attack()">
<img src="http://i24.photobucket.com/albums/c25/tenniskid493/defend.gif" class="defendbutton" onclick="defend()">
<img src="http://i24.photobucket.com/albums/c25/tenniskid493/magic.gif" class="spellbutton" onclick="spellbox()">
<img src="http://i24.photobucket.com/albums/c25/tenniskid493/item.gif" class="itembutton" onclick="item()"><br>

</body>

</html>

Bill Posters

02-16-2006, 05:55 PM

Option 1:
function attack() {

var bodyEl = document.body;
bodyEl.innerHTML += "<p>Hello<\/p>";

}

Option 2:
function attack() {

var bodyEl = document.getElementsByTagName('body')[0];
var pEl = document.createElement('p');
var addText = document.createTextNode('Hello');

pEl.appendChild(addText);
bodyEl.appendChild(pEl);

}

A1ien51

02-16-2006, 06:08 PM

http://www.webdeveloper.com/forum/showthread.php?t=95544