當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
【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 οnlοad="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個元素?
在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 οnlοad="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個元素?
轉載請注明出處:http://blog.csdn.net/acmman/article/details/47615311
《新程序員》:云原生和全面數字化實踐50位技術專家共同創作,文字、視頻、音頻交互閱讀總結
以上是生活随笔為你收集整理的【JavaScript】document对象属性的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 单页后台模版
- 下一篇: Linux基础学习笔记-第五课:文件权限