Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Tiny Cross-browser DOM ready function in 111 bytes of JavaScript

DOM Ready

Tiny Cross-browser DOM ready function in 111 bytes of JavaScript.

<!doctype html>
<title>Demo</title>
<script>
var DOMReady = function(a,b,c){b=document,c='addEventListener';b[c]?b[c]('DOMContentLoaded',a):window.attachEvent('onload',a)}
DOMReady(function () {
alert('The DOM is Ready!');
});
</script>
<h1>Demo</h1>
<p>Tiny Cross-browser DOM ready function in 111 bytes</p>
/**
* @param {function} a The function to execute when the DOM is ready
*/
function(a, b, c) {
b = document
c = 'addEventListener'
b[c] ? b[c]('DocumentContentLoaded', a) : window.attachEvent('onload', a)
}
function(a,b,c){b=document,c='addEventListener';b[c]?b[c]('DOMContentLoaded',a):window.attachEvent('onload',a)}
@milosdjakonovic

This comment has been minimized.

Copy link

commented Aug 18, 2015

Window onload is not the same as dom ready aka DocumentContentLoaded here.
In IE8 and below this will fire function where all resources (such as images and so) is loaded.

@arobbins

This comment has been minimized.

Copy link

commented Oct 12, 2015

Beautiful. Thanks for sharing.

@herschel666

This comment has been minimized.

Copy link

commented Feb 17, 2016

In tinydomready.js it has to be DOMContentLoaded instead of DocumentContentLoaded.

@jasdeepkhalsa

This comment has been minimized.

Copy link

commented Mar 10, 2016

Yes I believe that's a mistake @dciccale, in line 7 of tinydomready.js DocumentContentLoaded should be DOMContentLoaded. In the last revision this was changed for some reason.

@SmithWebster

This comment has been minimized.

Copy link

commented Dec 14, 2016

Perfect! Thanks!

@zymokey

This comment has been minimized.

Copy link

commented Jun 2, 2017

window.onload is not the same as DOMContentLoaded
https://developer.mozilla.org/en-US/docs/Web/Events/DOMContentLoaded

@bdalina54

This comment has been minimized.

Copy link

commented Aug 21, 2017

Great work, i also see this from https://stackoverflow.com/questions/799981/document-ready-equivalent-without-jquery by Peter Mortensen and Timo Huovinen

function start(f){ /in/.test(document.readyState)?setTimeout(start,5,f) : f()}

usage

start(function() {alert("I'm ready"); });

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.