The document.write command is a standard, yet powerful, JavaScript command for writing output to a page. In this article I’ve outline 3 ways to use document.write statements.

Example 1

<script type="text/javascript">
document.write('<div>');
document.write('	<h4>Example 1 using document.write</h4>');
document.write('	<p>This example uses multiple document.write commands to write ouput to a page.</p>');
document.write('</div>');
</script>

Example 2

<script type="text/javascript">
var output = '';
output  = '<div>';
output  = '	<h4>Example 2 using document.write</h4>';
output  = '	<p>This example uses a lengthy string and a single document.write command to write ouput to a page.</p>';
output  = '</div>';
document.write(output);
</script>

Example 3

<script type="text/javascript">
var output = [
'<div>',
'	<h4>Example 3 using document.write</h4>',
'	<p>This example uses an array and a single document.write command to write output to a page.</p>',
'</div>'
];
document.write(output.join('\n'));
</script>

View live demonstration with all 3 examples.

Related posts:

1. Simple Way to Track 404 Error Pages with Google Analytics
2. How to Install Google Analytics on WordPress
3. Neat Pop-up Windows for Images

I have often considered myself to be a perfectionist since I spend much of my time fixing unnoticeable imperfections. Until recently I was using the javascript function window.open for some of my pop up images and had to guess at what the height and width arguments should be so that no white would show in the pop-up window. This quickly became very aggravating as I was adjusting these values by a few pixels each time then checking to see how it looked in IE6 and FireFox. Then I started using the window.resize function which automatically resizes the window after it has loaded to what ever values you specify. Well I have given up on those methods and I will share with you how you can too.

I swiped a javascript file one day while surfing the web and I use this script to create neat pop-up windows for images.

Place the code below into the head section of your page.

<script type="text/javascript" src="mosthumb.js"></script>

Then, use the following code in the body section to contruct your thumbnail links.

<a href="javascript:thumbWindow('YourLargeImageHere',
'Pop-up Windows Title Goes Here',600,400,0,1);">
<img src="YourSmallImageHere" width="150"
height="100" alt="Picture Description" border="0" />
</a>

Click on the thumbnail below for an example of this script in action.

Please note, I have slightly modified the original javascript file but do not take any credit for the creation of this script. You can download the javascript file here.

Related posts:

1. Open Links in New Windows
2. Cool Digital Camera Trick
3. Search in File Contents in Windows