以下body部分：

<!DOCTYPEhtml><htmllang="en"><head><metacharset="utf-8"><title>ExplainingtheDdocumentObModel</title><linkhref="style08.css"type="text/css"rel="stylesheet"/></head><body><h2>WhatistheDocumentobjectModel?</h2><p>The<abbrtitle="WorleWideWebConsortium">W3C</abbr>definesthe<abbrtitle="ObjectModel">DOM</abbr>as:</p><blockquotecite="http://www.w3.org/DOM/"><P>Aplatform-andlanguage-neutralinterfacethatwillallowprogramsandscriptstodynamicallyaccessandupdatethecontent,structureandstylesofdocuments.</p></blockquote><p>Itisan<abbrtitle="ApplicationProgrammingInterface">API</abbr>thatcanbeusedtonavigate<abbrtitle="eXtensibleMarkupLanguage">XML</abbr>documents.</p><scriptsrc="test.js"></script></body></html>

以下是js部分：

functionaddLoadEvent(func){//不管在页面加载完毕执行多少个函数，都应付自如varoldonload=window.onload;if(typeofwindow.onload!='function'){window.onload=func;}else{window.onload=function(){oldonload();func();}}}functiondisplayAbbreviations(){//检查兼容性if(!document.getElementsByTagName||!document.createElement||!document.createTextNode)returnfalse;varabbreviations=document.getElementsByTagName("abbr");//取得所有缩略词if(abbreviations.length<1)returnfalse;vardefs=newArray();for(vari=0;i<abbreviations.length;i++){//遍历这些缩略词varcurrent_abbr=abbreviations[i];vardefinition=current_abbr.getAttribute("title");varkey=current_abbr.lastChild.nodeValue;defs[key]=definition;}vardlist=document.createElement("dl");//创建定义列表for(keyindefs){//遍历定义vardefinition=defs[key];vardtitle=document.createElement("dt");//创建定义标题vardtitle_text=document.createTextNode(key);dtitle.appendChild(dtitle_text);varddesc=document.createElement("dd");//创建定义描述varddesc_text=document.createTextNode(definition);ddesc.appendChild(ddesc_text);//把它们添加到定义列表dlist.appendChild(dtitle);dlist.appendChild(ddesc);}varheader=document.createElement("h3");//创建标题varheader_text=document.createTextNode("Abbreviations");header.appendChild(header_text);document.body.appendChild(header);//把标题添加到页面主体document.body.appendChild(dlist);//把定义列表添加到主体}addLoadEvent(displayAbbreviations);

页面预览效果：