<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>test dom</title>
<script type="text/javascript">
Code:
if(document.createTextNode){
onload= function(){
document.close();
document.getElementById('showlist').onclick= function(){
var targ= document.getElementById('thelist');
if(targ.className== 'hidelistClass') targ.className='';
else targ.className= 'hidelistClass';
}
}
document.write('<style>.hidelistClass{display:none}button{margin:0 1em;cursor:pointer;font-size:1em}<\/style>');
}
</script>
</head>
<body>
<h1 id="p_opts">Dom test <button id="showlist">List</button></h1>
<ul id="thelist" class="hidelistClass">
<li>First list item</li>
<li>Second list item</li>
</ul>
</h1>
</body>
</html>
The script can be loaded via a src attribute, the style can be a dom created link element with a href to a style sheet url.
The script is evaluated before the body starts to render, and any links to stylesheets download before the rendering continues.
Bookmarks