document.write()

**nails11** · Oct 28, 2003, 18:34

i am trying to call a method that does a document.write() from an onclick on a button. the document.write() is overwriting everyting on the page. i just want to add it to the stuff already on the page. when i call the function by itself (not from the onclick) it appends instead of rewriting. anyone familiar with this? thx

**beetle** · Oct 28, 2003, 19:10

You can't use document.write() after the current document is fully loaded (and therefore, closed). Using document.write() after pageload creates a new document and writes to it, which is why your page goes blank -- the new document replaces the current one.

You will need to use the DOM to manipulate and/or create text and elements instead.

What sort of stuff are you adding?

**Mark_Elford** · Oct 29, 2003, 02:38

Nails 11.

Here is an example of how I insert text on the fly, should help you I think..

Hey anyone know how to paste HTML code into a reply.. oh well.

<html>
<table>
<td>
Test of inserting Text
<td>
<td>
<input type = button name=cmdInsert onclick="insertText()">
</td>
<td>
<div name="insertedText" id=insertedText></div>
</td>

<script>
function insertText()
{
insertedText.innerHTML = "Inserted Text"
}
</script>

**MikeFoster** · Oct 29, 2003, 08:10

Originally Posted by Mark_Elford

Hey anyone know how to paste HTML code into a reply...

Hi Mark, look at the code and html tags on this page.

**Mark_Elford** · Oct 29, 2003, 08:18

Ahhhh, I see so if I do This it should paste in correctly instead of actually giving the output of my code. : -

HTML Code:

<html>
<table>
<td>
Test of inserting Text
<td>
<td>
<input type = button name=cmdInsert onclick="insertText()">
</td>
<td>
<div name="insertedText" id=insertedText></div>
</td>

<script>
function insertText()
{
insertedText.innerHTML = "Inserted Text"
}
</script>

Thanks for that.

**adios** · Oct 29, 2003, 10:46

Code:

insertedText.innerHTML = "Inserted Text"

Only works in Internet Explorer! The W3C way (OK, sorta):

Code:

document.getElementById('insertedText').innerHTML = "Inserted Text"

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>untitled</title>
<style type="text/css">

p {font: 600 16px verdana; color: #6699cc;}

</style>
<script type="text/javascript" language="javascript">

function insert_it(what, where)
{
	where = document.getElementById(where);
	where.innerHTML = what;
}

var imgtag = '<img src="http://www.sitepointforums.com/images/icons/icon6.gif">stuff';

</script>
</head>
<body>
<p></p>
<p>
i just want to add it to the <span id="poke">
<img src="http://www.sitepointforums.com/images/icons/icon5.gif"></span> already on the page.
</p>
<input type="button" value="stuff" onclick="insert_it(this.value,'poke')">
<input type="button" value="junk" onclick="insert_it(this.value,'poke')">
<input type="button" value="incredible mishmash" onclick="insert_it('<i>' + this.value + '</i>','poke')">
<input type="button" value="HTML" onclick="insert_it('<small>' + this.value + '</small>','poke')">
<input type="button" value="kewl" onclick="insert_it(imgtag,'poke')">
</body>
</html>

User Tag List

Thread: document.write()

Thread Tools

Display

Hybrid View

document.write()

Bookmarks

Bookmarks

Posting Permissions