The eighth chapter is a few common methods of skillful DOM

Show "Abbreviated Words"

• <abbr> tags indicate abbreviations or abbreviations, such as

<ABBR title= "World Wide Web Consortium" >W3C</abbr>

• <acronym> tags define acronyms. The label is not already supported in HTML5. <abbr> tags are recommended instead.
• The definition table (<dl>) consists of a series of "definition headings" <dt> and corresponding "definition descriptions" <dd> compositions.
• For/in Cycle

What makes it unique is that you can temporarily assign an array's subscript key to a variable: for (variable in arry)

<H1>What is the Document Object Model?</H1><P> the<abbrtitle= "World Wide Web Consortium">W3c</abbr>Defines the<abbrtitle= "Document Object Model">Dom</abbr>As :</P><blockquotecite= "http://www.w3.org/DOM/">    <P>A Platform-and Language-neutral interface that'll allow programs and scripts to dynamically access and UPDA    Te the content, structure and style of documents. </P></blockquote><P>It 's an<abbrtitle= "Application Programming Interface">Api</abbr>That can is used to navigate HTML and XML documents.</P>

Extract <abbr> from the HTML file above, and use JS to display a list of abbreviations, such as:

JS file as follows:

/*Writing DISPLAYABBR functions*/functiondisplayabbr () {if(!document.getelementsbytagname | |!document.createelement | |!document.createtextnode)return false;varabbr = document.getElementsByTagName ("abbr")if(abbr.length<1)return false;//Check if there is a <abbr>varDefs =NewArray (); for(vari=0; i<abbr.length; i++){    varAbbrtitle = Abbr[i].getattribute ("title"); varkey = Abbr[i].lastchild.nodevalue;//extracts <abbr> tags in the thumbnail words        //The values of the two variables, abbrtitle and key, are saved in the defs array, one as the array subscript key and the other as the value of the array element:Defs[key] =Abbrtitle;}/*Creating HTML content*/varDlist = document.createelement ("DL");//use a for/in loop to iterate through the defs array: for(Keyinchdefs) {    varAbbrtitle =Defs[key]; varDtitle = document.createelement ("DT"); varDtitle_text =document.createTextNode (key);    Dtitle.appendchild (Dtitle_text); varDdesc = document.createelement ("DD"); varDdesc_text =document.createTextNode (Abbrtitle);    Ddesc.appendchild (Ddesc_text); //The above creates two element nodes that contain text nodes, respectively .Dlist.appendchild (Dtitle); Dlist.appendchild (DDESC);}varHeader = Document.createelement ("H2");varHeader_text = document.createTextNode ("abbreviations"); Header.appendchild (Header_text);d ocument.body.appendChild (header);d ocument.body.appendChild (dlist);} Window.onload= DISPLAYABBR;

Final example:

Show "Document Source Connection"

• Continue

Continue and break are a bit similar, except that continue terminates the loop, and then executes the subsequent loop, and break terminates the loop completely.
It can be understood that continue is skipping the remaining statements in the secondary loop, performing the next loop.

• <blockquote>: Define block references all text between,<blockquote> and </blockquote> is separated from the regular text, often indented on the left and right sides (increasing margins), And sometimes italics are used. The <q> element marks a short reference.
• This tag contains the attribute cite, which is optional. The purpose is to give a URL address that tells us the source of the reference. Mainstream browsers ignore the existence of the cite attribute, which is not visible to the user. With Js+dom, we can make it appear on the Web page.

/*Show source of literature*//*Writing Displaycite functions*/functionDisplaycite () {if(!document.getelementsbytagname | |!document.createtextnode | |!document.createelement)return false; varQuotes = document.getElementsByTagName ("blockquote");  for(vari=0; i<quotes.length; i++){        if(!quotes[i].getattribute ("cite")){            Continue;//determine if there is a cite attribute        }        varurl = quotes[i].getattribute ("cite"); varQuotechildren = Quotes[i].getelementsbytagname ("*");//gets all element points in the current BLOCKQUOTE element        if(quotechildren.length<1)Continue; varElem = Quotechildren[quotechildren.length-1];//gets the last element point in the blockquote element        varlink = document.createelement ("a"); varLink_text = document.createTextNode ("source");        Link.appendchild (Link_text); Link.setattribute ("href", URL); //wrapping link with sup element node to render superscript effect        varsup = document.createelement ("Sup");        Sup.appendchild (link);    Elem.appendchild (SUP); }}window.onload= DISPLAYABBR;

The eighth chapter is a few common methods of skillful DOM