1. 程式人生 > >【JavaScript】document物件屬性

【JavaScript】document物件屬性

document物件中,並沒有特別的事件,它所支援的都是通用的。
在document上講解這些屬性不具有典型性,但只要掌握了一個物件
在某個事件上的處理方式,也就自然的掌握了在其它物件上處理這個
事件。

對於document物件所支援的事件在這裡就不贅述了。

下面說一下document物件屬性:
1.forms陣列物件:代表html文件中的所有form標籤對的集合。
2.anchors陣列物件:代表html文件中所有指定的name屬性或id屬性的a
標籤對的集合。
3.links陣列物件:代表html文件中所有指定的href屬性的a標籤對的集合。
4.images陣列物件:代表html文件中所有指定的img標籤對的集合。
5.scripts陣列物件:代表html文件中所有指定的script標籤對的集合。
6.applets陣列物件:代表html文件中所有指定的applet標籤對的集合,
applet是屬於Java程式設計的一種專門技術,不屬於Javascript的內容
7.all陣列物件:所有的html標籤集合。
8.styleSheets陣列物件:所有的style、link標籤、import引入的樣式表
的集合。
9.body物件:代表body標籤對,body標籤中的子標籤可以作為body物件的
屬性來使用。
10.title物件:代表html文件中所有指定的title標籤對的集合,我們可以
通過這個物件設定title標題的內容。

documents物件屬性舉例1:
先看一段html程式碼:
<body onload="checkall()">
<a href="#mark" name="href1">to p1</a>
<a href="#mark" name="href2">to p2</a>
<img src="sample.gif" name="img1">
<form name="form1">
<input type=submit>
</form>
<a name="mark1">paragraph1
<form name="form2">
<input type=text name="user"><br>
<input type=submit>
</form>
<a name="mark2">paragraph2
</body>

在checkall()方法裡,我們會開啟一個新的文件視窗,
顯示上面各類html標籤的統計資訊:
<script language="javascript" name=script1> 
function checkall()
{
	var owin=window.open("","_blank");
	
	owin.document.write("<table border=1 width=400 style='FONT-SIZE:xx-small'>"+
	   "<caption>all數組裡一共有"+document.all.length+"個元素</caption><tr>")
	for(var i=0;i<document.all.length;i++)
	{
	     owin.document.write("<td>"+document.all[i].tagName+"</td>");
	}
	owin.document.writeln("</tr></table>");
	   
    var objnames=["links","forms","anchors","scripts","images"];
    for(var j=0;j<objnames.length;j++)
    {
        owin.document.write("<table border=1 width=400 style='FONT-SIZE:xx-small'>"+"<caption>");
        eval('owin.document.write(objnames[j]+"陣列一共有"+document.'+objnames[j]+'.length)');
        owin.document.write("個元素</caption><tr>");
    }
    var len=0;
    eval("lan=document."+objnames[j]+".length");
    for(var i=0;i<len;i++)
    {
               eval('owin.document.wrtie("<td>"+document.'+objnames[j]+'[i].name+"</td>")');
    }
    owin.document.writeln("</td></table>");
 
}
</script>

執行效果:
all數組裡一共有16個元素 HTML HEAD TITLE SCRIPT BODY A A IMG FORM INPUT A FORM INPUT BR INPUT A 
links陣列一共有2個元素 
forms陣列一共有2個元素 
anchors陣列一共有4個元素 

scripts陣列一共有1個元素