javascript里的document.all用法

it2022-05-05  137

1 、理解document.all[]   从IE4开始IE的object model才增加了 document.all[],来看看 document.all[]的Description: Array of all HTML tags in the document.Collection of all elements contained by the object.   也就是说 document.all[]是文档中所有标签组成的一个数组变量,包括了文档对象中所有元素(见例1)。   IE’s document.all collection exposes all document elements.This array provides access to every element in the document.    document.all[]这个数组可以访问文档中所有元素。   例1(这个可以让你理解文档中哪些是对象) <!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.All Example</title> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" /> </head> <body> <h1>Example Heading</h1> <hr /> <p>This is a <em>paragraph</em>. It is only a <em>paragraph.</em></p> <p>Yet another <em>paragraph.</em></p> <p>This final <em>paragraph</em> has <em id="special">special emphasis.</em></p> <hr /> <script type="text/javascript"> <!-- var i,origLength; origLength = document.all.length; document.write(' document.all.length='+origLength+"<br />"); for (i = 0; i < origLength; i++) { document.write(" document.all["+i+"]="+ document.all[i].tagName+"<br />"); } //--> </script> </body> </html> 输出结果:   Example Heading
This is a paragraph. It is only a paragraph. Yet another paragraph. This final paragraph has special emphasis.

document.all.length=317document.all[0]=!document.all[1]=HTMLdocument.all[2]=HEADdocument.all[3]=TITLEdocument.all[4]=METAdocument.all[5]=METAdocument.all[6]=METAdocument.all[7]=METAdocument.all[8]=METAdocument.all[9]=METAdocument.all[10]=LINKdocument.all[11]=LINKdocument.all[12]=LINKdocument.all[13]=!document.all[14]=METAdocument.all[15]=METAdocument.all[16]=METAdocument.all[17]=METAdocument.all[18]=METAdocument.all[19]=METAdocument.all[20]=METAdocument.all[21]=!document.all[22]=BODYdocument.all[23]=FORMdocument.all[24]=DIVdocument.all[25]=INPUTdocument.all[26]=!document.all[27]=STYLEdocument.all[28]=SCRIPTdocument.all[29]=DIVdocument.all[30]=SCRIPTdocument.all[31]=LINKdocument.all[32]=DIVdocument.all[33]=TABLEdocument.all[34]=TBODYdocument.all[35]=TRdocument.all[36]=TDdocument.all[37]=Adocument.all[38]=TDdocument.all[39]=Adocument.all[40]=TDdocument.all[41]=Adocument.all[42]=TDdocument.all[43]=Adocument.all[44]=TDdocument.all[45]=Adocument.all[46]=TDdocument.all[47]=Adocument.all[48]=TDdocument.all[49]=Adocument.all[50]=TDdocument.all[51]=Adocument.all[52]=TDdocument.all[53]=Adocument.all[54]=TDdocument.all[55]=Adocument.all[56]=TDdocument.all[57]=Adocument.all[58]=TDdocument.all[59]=Adocument.all[60]=TDdocument.all[61]=Adocument.all[62]=TDdocument.all[63]=Adocument.all[64]=TDdocument.all[65]=Adocument.all[66]=TDdocument.all[67]=Adocument.all[68]=!document.all[69]=DIVdocument.all[70]=DIVdocument.all[71]=!document.all[72]=DIVdocument.all[73]=DIVdocument.all[74]=SPANdocument.all[75]=DIVdocument.all[76]=DIVdocument.all[77]=Pdocument.all[78]=Adocument.all[79]=Adocument.all[80]=DIVdocument.all[81]=SPANdocument.all[82]=DIVdocument.all[83]=Pdocument.all[84]=DIVdocument.all[85]=SPANdocument.all[86]=DIVdocument.all[87]=DIVdocument.all[88]=Pdocument.all[89]=Adocument.all[90]=IMGdocument.all[91]=Pdocument.all[92]=Adocument.all[93]=IMGdocument.all[94]=Pdocument.all[95]=Adocument.all[96]=IMGdocument.all[97]=Pdocument.all[98]=Adocument.all[99]=IMGdocument.all[100]=Pdocument.all[101]=Adocument.all[102]=IMGdocument.all[103]=Pdocument.all[104]=Adocument.all[105]=IMGdocument.all[106]=Pdocument.all[107]=Adocument.all[108]=IMGdocument.all[109]=!document.all[110]=DIVdocument.all[111]=H5document.all[112]=DIVdocument.all[113]=ULdocument.all[114]=LIdocument.all[115]=Adocument.all[116]=IMGdocument.all[117]=SPANdocument.all[118]=Adocument.all[119]=Pdocument.all[120]=LIdocument.all[121]=Adocument.all[122]=IMGdocument.all[123]=SPANdocument.all[124]=Adocument.all[125]=Pdocument.all[126]=LIdocument.all[127]=Adocument.all[128]=IMGdocument.all[129]=SPANdocument.all[130]=Adocument.all[131]=Pdocument.all[132]=DIVdocument.all[133]=H5document.all[134]=DIVdocument.all[135]=ULdocument.all[136]=LIdocument.all[137]=Adocument.all[138]=IMGdocument.all[139]=SPANdocument.all[140]=Adocument.all[141]=Pdocument.all[142]=LIdocument.all[143]=Adocument.all[144]=IMGdocument.all[145]=SPANdocument.all[146]=Adocument.all[147]=Pdocument.all[148]=LIdocument.all[149]=Adocument.all[150]=IMGdocument.all[151]=SPANdocument.all[152]=Adocument.all[153]=Pdocument.all[154]=!document.all[155]=DIVdocument.all[156]=SPANdocument.all[157]=DIVdocument.all[158]=DIVdocument.all[159]=TABLEdocument.all[160]=TBODYdocument.all[161]=TRdocument.all[162]=TDdocument.all[163]=Adocument.all[164]=IMGdocument.all[165]=TDdocument.all[166]=Adocument.all[167]=IMGdocument.all[168]=HRdocument.all[169]=ULdocument.all[170]=Adocument.all[171]=LIdocument.all[172]=Adocument.all[173]=LIdocument.all[174]=Adocument.all[175]=LIdocument.all[176]=Adocument.all[177]=LIdocument.all[178]=Adocument.all[179]=LIdocument.all[180]=Adocument.all[181]=LIdocument.all[182]=Adocument.all[183]=LIdocument.all[184]=Adocument.all[185]=Adocument.all[186]=LIdocument.all[187]=Adocument.all[188]=Adocument.all[189]=LIdocument.all[190]=Adocument.all[191]=LIdocument.all[192]=Adocument.all[193]=Adocument.all[194]=Pdocument.all[195]=Adocument.all[196]=Adocument.all[197]=!document.all[198]=!document.all[199]=DIVdocument.all[200]=SCRIPTdocument.all[201]=!document.all[202]=DIVdocument.all[203]=DIVdocument.all[204]=H5document.all[205]=DIVdocument.all[206]=Pdocument.all[207]=BRdocument.all[208]=BRdocument.all[209]=DIVdocument.all[210]=Pdocument.all[211]=Adocument.all[212]=Adocument.all[213]=DIVdocument.all[214]=Pdocument.all[215]=SELECTdocument.all[216]=OPTIONdocument.all[217]=OPTIONdocument.all[218]=OPTIONdocument.all[219]=OPTIONdocument.all[220]=OPTIONdocument.all[221]=INPUTdocument.all[222]=SPANdocument.all[223]=IMGdocument.all[224]=IMGdocument.all[225]=IMGdocument.all[226]=IMGdocument.all[227]=IMGdocument.all[228]=SPANdocument.all[229]=Adocument.all[230]=Adocument.all[231]=Adocument.all[232]=Adocument.all[233]=SPANdocument.all[234]=DIVdocument.all[235]=Pdocument.all[236]=DIVdocument.all[237]=Pdocument.all[238]=DIVdocument.all[239]=STRONGdocument.all[240]=STRONGdocument.all[241]=SPANdocument.all[242]=BRdocument.all[243]=BRdocument.all[244]=STRONGdocument.all[245]=SPANdocument.all[246]=STRONGdocument.all[247]=SPANdocument.all[248]=BRdocument.all[249]=DIVdocument.all[250]=STRONGdocument.all[251]=SPANdocument.all[252]=BRdocument.all[253]=BRdocument.all[254]=STRONGdocument.all[255]=SPANdocument.all[256]=DIVdocument.all[257]=STRONGdocument.all[258]=SPANdocument.all[259]=BRdocument.all[260]=BRdocument.all[261]=DIVdocument.all[262]=BRdocument.all[263]=BRdocument.all[264]=BRdocument.all[265]=BRdocument.all[266]=STRONGdocument.all[267]=SPANdocument.all[268]=BRdocument.all[269]=BRdocument.all[270]=BRdocument.all[271]=BRdocument.all[272]=BRdocument.all[273]=BRdocument.all[274]=BRdocument.all[275]=BRdocument.all[276]=BRdocument.all[277]=BRdocument.all[278]=BRdocument.all[279]=BRdocument.all[280]=BRdocument.all[281]=STRONGdocument.all[282]=SPANdocument.all[283]=BRdocument.all[284]=STRONGdocument.all[285]=SPANdocument.all[286]=BRdocument.all[287]=BRdocument.all[288]=BRdocument.all[289]=STRONGdocument.all[290]=SPANdocument.all[291]=STRONGdocument.all[292]=SPANdocument.all[293]=BRdocument.all[294]=BRdocument.all[295]=BRdocument.all[296]=BRdocument.all[297]=BRdocument.all[298]=DIVdocument.all[299]=DIVdocument.all[300]=DIVdocument.all[301]=STRONGdocument.all[302]=FONTdocument.all[303]=DIVdocument.all[304]=HRdocument.all[305]=DIVdocument.all[306]=EMdocument.all[307]=EMdocument.all[308]=DIVdocument.all[309]=EMdocument.all[310]=DIVdocument.all[311]=EMdocument.all[312]=EMdocument.all[313]=DIVdocument.all[314]=HRdocument.all[315]=Pdocument.all[316]=SCRIPTdocument.all.length=18document.all[0]=!document.all[1]=HTMLdocument.all[2]=HEADdocument.all[3]=TITLEdocument.all[4]=METAdocument.all[5]=BODYdocument.all[6]=H1document.all[7]=HRdocument.all[8]=Pdocument.all[9]=EMdocument.all[10]=EMdocument.all[11]=Pdocument.all[12]=EMdocument.all[13]=Pdocument.all[14]=EMdocument.all[15]=EMdocument.all[16]=HRdocument.all[17]=SCRIPT

  例2(访问一个特定元素) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>单击DIV变色</title> <style type="text/css"> <!-- #docid{ height:400px; width:400px; background-color:#999;} --> </style> </head> <body><div id="docid" name="docname" onClick="bgcolor()"></div> </body> </html> <script language="javascript" type="text/javascript"> <!-- function bgcolor(){ document.all[7].style.backgroundColor="#000" } --> </script>   上面的这个例子让你了解怎么访问文档中的一个特定元素,比如文档中有一个DIV <div id="docid" name="docname"></div>,你可以通过这个DIV的ID,NAME或INDEX属性访问这个DIV: document.all["docid"] document.all["docname"] document.all.item("docid") document.all.item("docname") document.all[7] document.all.tags("div")则返回文档中所有DIV数组,本例中只有一个DIV,所以用 document.all.tags("div")[0]就可以访问了。    2、使用document.all[] 例3 <!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.All Example #2</title> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" /> </head> <body> <!-- Works in Internet Explorer and compatible --> <h1 id="heading1" align="center" style="font-size: larger;">DHTML Fun!!!</h1> <form name="testform" id="testform" action="#" method="get"> <br /><br /> <input type="button" value="Align Left" οnclick=" document.all['heading1'].align='left';" /> <input type="button" value="Align Center" οnclick=" document.all['heading1'].align='center';" /> <input type="button" value="Align Right" οnclick=" document.all['heading1'].align='right';" /> <br /><br /> <input type="button" value="Bigger" οnclick=" document.all['heading1'].style.fontSize='xx-large';" /> <input type="button" value="Smaller" οnclick=" document.all['heading1'].style.fontSize='xx-small';" /> <br /><br /> <input type="button" value="Red" οnclick=" document.all['heading1'].style.color='red';" /> <input type="button" value="Blue" οnclick=" document.all['heading1'].style.color='blue';" /> <input type="button" value="Black" οnclick=" document.all['heading1'].style.color='black';" /> <br /><br /> <input type="text" name="userText" id="userText" size="30" /> <input type="button" value="Change Text" οnclick=" document.all['heading1'].innerText=document.testform.userText.value;" /> </form> </body> </html>  

转载于:https://www.cnblogs.com/delin/archive/2010/06/18/1759955.html

相关资源:各显卡算力对照表!

最新回复(0)