html:
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Explaining the Document Object Model</title>
<link rel="stylesheet" media="screen" href="typographt.css">
</head>
<body>
<h1>What is the Document Object Model?</h1>
<p>
The
<abbr title="World Wide Web Consortium">W3C</abbr>defines the
<abbr title="Document Objec Model">DOM</abbr> as:
</p>
<blockquote cite="http://www.w3.org/DOM/">
<p>
A platform- and language-neutral interface that will allow programs
and sceipts to dynamically access and update the
content,structure and style of documents.
</p>
</blockquote>
<p>
IT is an
<abbr title="Applicarion Programming Interface">API</abbr>
that can be used to navigate
<abbr title="HyoerText Markup Language">HTML</abbr>and
<abbr title="eXtensible Markup">XML</abbr> document.
</p>
<script src="addLoadEvent(func).js"></script>
<script src="displayAbbreviations.js"></script>
</body>
</html>
JS:
function displayAbbreviations(){
"use strict";
addLoadEvent(displayAbbreviations);
if(!document.getElementsByTagName || !document.createElement || !document.createTextNode)
{
return false;
}
var abbreviations = document.getElementsByTagName("abbr");
if (abbreviations.length < 1)
{
return false;
}
var defs = new Array();
for (var i=0; i<abbreviations.length;i++){
var current_abbr = abbreviations[i] ;
var definition = current_abbr.getAttribute("title");
var key = current_abbr.lastChild.nodeValue;
defs[key] = definition;
}
var dlist = document.createElement("dl");
for(key in defs){
var definition = defs[key];
var dtitle = document.createElement("dt");
var dtitle_text = document.createTextNode(key);
dtitle.appendChild(dtitle_text);
var ddesc = document.createElement("dd");
var ddesc_text = document.createTextNode(definition);
ddesc.appendChild(ddesc_text);
dlist.appendChild(dtitle);
dlist.appendChild(ddesc);
}
var header = document.createElement("h2");
var header_text = document.createTextNode("Abbreviations");
header.appendChild(header_text);
document.body.appendChild(header);
document.body.appendChild(dlist);
}
function addLoadEvent(func){
"use strict";
var oldonload = window.onload;
if (typeof window.onload !== 'function'){
window.onload = func;
} else {
window.onload = function(){
oldonload();
func();
};
}
}
qq_秋城纸扇雪纷飞_0