Navigation Menu

What's New?
Alphabetical Listing
Site Contents


Site FAQ
About JSS
JavaScript Forum
JavaScript Tutorial
Friends of JSS

Link to Us
JavaScript Help
Contribute a script
Technology Jobs

Become a Partner

Internet.commerce

Be a Commerce Partner














Internet.com

IT
Developer
Internet News
Small Business
Personal Technology
International

Search internet.com
Advertise
Corporate Info
Newsletters
Tech Jobs
E-mail Offers

Developer Channel

FlashKit.com
JavaScript.com
JavaScriptSource
Developer Jobs
ScriptSearch
StreamingMediaWorld
Web Developer's Journal
Web Developer's Virtual Library
WebDeveloper.com
Webreference
Web Hosts
XMLfiles.com

Great Sites

DocJavaScript.com
dhtml.com
The Freebie Directory
TheFreeSite.com

Browse Doc JS's Tips!


Hiermenus Central


Promotions

Free Announcements


Social Bookmark

General

An easy-to-use snippet, that allows other DOM scripting to run before window.onload. The practical benefit is that JavaScript doesn't have to wait for images or other dependencies to finish loading. It can begin as soon as the DOM is ready.


Notes

The link to the script can go anywhere, but if it's going to call other functions it must come after them in the source code. Then use the object constructor to define individual functions. You can either call a named function:


var foobar = new domFunction(myFunction);

Or write an anonymous function directly inside the constructor:


var foobar = new domFunction(function() {
	 //code ...
});

The function will be called once the DOM is ready (determined by the existence of the getElementsByTagName method and the presence of the <body> element; this is the point at which you can safely use DOM methods, including creating and appending new elements to the <body>).

You can treat it essentially the same as a regular onload function except that - if you're going to manipulate (e.g., read from or append to) any existing HTML elements other than the body, you must also test for those elements before calling your script.

And for this purpose the constructor takes an optional second argument - an object-literal which defines the elements or collections that the script should test before trying to call the function:


var foobar = new domFunction(function() {
	//code ...
}, { 'poster' : 'id', 'h1' : 'tag' });

Each name/value pair should be either:

  • the ID of an element, followed by the value "id", to test whether that element exists; or
  • the tag name of an element, followed by the value "tag", to test whether that collection has any members.

Source Code

Paste this source code into the designated areas.

External file

Paste this code into an external JavaScript file named: domFunction.js


Head

Paste this code into the HEAD section of your HTML document.


User Comments

Add a comment, suggestion, or correction
[For questions about usage, consult the Notes tab above or visit the JavaScript forum. Do not include more than two (2) lines of code in your comments. If you have suggestions or corrections, you can submit them to us.]

    
   
       
[optional]
 
[optional]

   

Comments feed Comment Feed RSS 2.0


Do you write JavaScripts?
If you do, why not submit them to us?
We'll give you credit and a link back to your Web site.