Free Web Hosting by Netfirms
 Web Hosting by Netfirms | Free Domain Names by Netfirms

Changing the content of a document

The content of the document can be changed with the "write" method of the document object.

The following example is going to show a welcome message as normal html in the document then it will show prompt asking the user for their name. Once the name is given and the confirm button is pressed the name is written to the document and a concluding message is appended as normal html. Run Code | View Code

Process

Getting the message - The prompt method Inserting the message - JavaScript embedded into the body tag

Events

The loading of the document - on load event of the body tag

Input

Event Trigger

The embedded script tag will directly be executed as soon as the script engine gets to the line it's on.

The Solution

Insert a normal html string Welcome back Define the script container Welcome back <script language="javascript"> </script> Get the user name. Note this method will freeze the script engine since it makes a model dialog. The value returned by the prompt method is variable (dynamic) content. Welcome back <script language="javascript"> Var name = prompt("Your Name","your name") </script> Write the name value to the document with the "write" method of the document object. Welcome back <script language="javascript"> Var name = prompt("Your Name","your name") document.write(name); </script> Insert the last normal html string Welcome back <script language="javascript"> Var name = prompt("Your Name","your name") document.write(name); </script> Hope you enjoy your stay

Usefulness

The "write" method is useful when a web author wants to insert variable content in to the document. For example the date, time or the date the document was last modified etc.

Notes

Wipeout notice

One must note that when the content is changed with the "write" method (If the document has loaded) all previously written content is wiped out and cleared.

Method placement

The write method is normally used in the body tag while it is loading which allows static content and dynamic content to be mixed and merged.

Run Code | View Code

See also Using prompt

Using alert | Using the status bar | Changing the content of a document | Using prompt | Using confirm | Changing the URL of a window Manually | Querying a text field's value | Checking the selected value of a select object | Checking if a checkbox is selected | Checking if a radio button is selected in a group | Making a rollover | Preloading images | Getting the time | Using setTimeout/setInterval | Making windows | Making cookies

JavaScript Tutorial Home