Accessing properties on the document object is slow in Internet Explorer. I used to use the document object as a place to store globals, ie
function onclick() {
document.clicks +=1;
}
But this is slow in IE. Instead use:
var clicks;
function onclick() {
clicks += 1;
}
Here is a
full page that demonstrates this idea. I use onmousemove to simplify doing an action over and over, and you can also FEEL how slow it is by moving your mouse around the page.
And the code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Document Object Test</title>
<script type="text/javascript">
var totalObj = new Object();
var flag = false;
function loaded() {
document.onmousemove = useDocument;
}
function useDocument() {
document.total += 5;
}
function useGlobal() {
totalObj.total += 5;
}
function flip() {
if (flag) {
document.onmousemove = useDocument;
document.getElementById('styleType').innerHTML = ' document object';
}
else {
document.onmousemove = useGlobal;
document.getElementById('styleType').innerHTML = ' global object';
}
flag = !flag;
}
</script>
</head>
<body onload="loaded();">
<a href="#" onclick="flip(); return false;">Click to flip styles</a><span id="styleType"> document</span>
</body>
</html>