<rt id="bn8ez"></rt>
<label id="bn8ez"></label>

  • <span id="bn8ez"></span>

    <label id="bn8ez"><meter id="bn8ez"></meter></label>

    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=18
    document.all[0]=!
    document.all[1]=HTML
    document.all[2]=HEAD
    document.all[3]=TITLE
    document.all[4]=META
    document.all[5]=BODY
    document.all[6]=H1
    document.all[7]=HR
    document.all[8]=P
    document.all[9]=EM
    document.all[10]=EM
    document.all[11]=P
    document.all[12]=EM
    document.all[13]=P
    document.all[14]=EM
    document.all[15]=EM
    document.all[16]=HR
    document.all[17]=SCRIPT
    (注意它只可以在IE上運行)
      例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]就可以訪問了。

      3、使用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"
    onclick="document.all['heading1'].align='left';" />//改變<h1></h1>標簽對中的align屬性的值,下面的代碼作用相同
    <input type="button" value="Align Center"
    onclick="document.all['heading1'].align='center';" />
    <input type="button" value="Align Right"
    onclick="document.all['heading1'].align='right';" />
    <br /><br />
    <input type="button" value="Bigger"
    onclick="document.all['heading1'].style.fontSize='xx-large';" />
    <input type="button" value="Smaller"
    onclick="document.all['heading1'].style.fontSize='xx-small';" />
    <br /><br />
    <input type="button" value="Red"
    onclick="document.all['heading1'].style.color='red';" />
    <input type="button" value="Blue"
    onclick="document.all['heading1'].style.color='blue';" />
    <input type="button" value="Black"
    onclick="document.all['heading1'].style.color='black';" />
    <br /><br />
    <input type="text" name="userText" id="userText" size="30" />
    <input type="button" value="Change Text"
    onclick="document.all['heading1'].innerText=document.testform.userText.value;" />//改變<h1></h1>標簽對中的文本內容
    </form>
    </body>
    </html>

    4、標準DOM中的訪問方法

      開頭就說過document.all[]不符合WEB標準,那用什么來替代它呢?document.getElementById


    Most third-party browsers are “strict standards” implementations, meaning that they implement W3C and ECMA standards and ignore most of the proprietary object models of Internet Explorer and Netscape.If the demographic for your Web site includes users likely to use less common browsers, such as Linux aficionados, it might be a good idea to avoid IE-specific features and use the W3C DOM instead. by Internet Explorer 6, we see that IE implements significant portions of the W3C DOM.

      這段話的意思是大多數第三方瀏覽器只支持W3C的DOM,如果你的網站用戶使用其他的瀏覽器,那么你最好避免使用IE的私有屬性。而且IE6也開始支持W3C DOM。

    畢竟大多數人還不了解標準,在使用標準前,你還可以在你的網頁中用document.all[]訪問文檔對象前面寫到WEB標準,今天繼續WEB標準下 可以通過getElementById(), getElementsByName(), and getElementsByTagName()訪問DOCUMENT中的任一個標簽:

      1、getElementById()

      getElementById()可以訪問DOCUMENT中的某一特定元素,顧名思義,就是通過ID來取得元素,所以只能訪問設置了ID的元素。

      比如說有一個DIV的ID為docid:

    <div id="docid"></div>

      那么就可以用getElementById("docid")來獲得這個元素。

    <!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>ById</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.getElementById("docid").style.backgroundColor="#000"
    }
    -->
    </script>

      2、getElementsByName()

      這個是通過NAME來獲得元素,但不知大家注意沒有,這個是GET ELEMENTS,復數ELEMENTS代表獲得的不是一個元素,為什么呢?

      因為DOCUMENT中每一個元素的ID是唯一的,但NAME卻可以重復。打個比喻就像人的身份證號是唯一的(理論上,雖然現實中有重復),但 名字重復的卻很多。如果一個文檔中有兩個以上的標簽NAME相同,那么getElementsByName()就可以取得這些元素組成一個數組。

      比如有兩個DIV:

      <div name="docname" id="docid1"></div>
      <div name="docname" id="docid2"></div>

      那么可以用getElementsByName("docname")獲得這兩個DIV,用getElementsByName("docname")[0]訪問第一個DIV,用getElementsByName("docname")[1]訪問第二個DIV。

      下面這段話有錯,請看forfor的回復,但是很可惜,IE沒有支持這個方法,大家有興趣可以在FIREFOX或NETSCAPE中調試下面這個例子。(我在NETSCAPE7.2英文版和FIREFOX1.0中調試成功。)

    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>Byname,tag</title>
    <style type="text/css">
    <!--
    #docid1,#docid2{
    margin:10px;
    height:400px;
    width:400px;
    background-color:#999;}
    -->
    </style>
    </head>
    <body>
    <div name="docname" id="docid1" onClick="bgcolor()"></div>
    <div name="docname" id="docid2" onClick="bgcolor()"></div>
    </body>
    </html>
    <script language="javascript" type="text/javascript">
    <!--
    function bgcolor(){
    var docnObj=document.getElementsByName("docname");
    docnObj[0].style.backgroundColor = "black";
    docnObj[1].style.backgroundColor = "black";
    }
    -->
    </script>

      3、getElementsByTagName()

      這個呢就是通過TAGNAME(標簽名稱)來獲得元素,一個DOCUMENT中當然會有相同的標簽,所以這個方法也是取得一個數組。

      下面這個例子有兩個DIV,可以用getElementsByTagName("div")來訪問它們,用getElementsByTagName("div")[0]訪問第一個DIV,用

    getElementsByTagName("div")[1]訪問第二個DIV。

    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>Byname,tag</title>
    <style type="text/css">
    <!--
    #docid1,#docid2{
    margin:10px;
    height:400px;
    width:400px;
    background-color:#999;}
    -->
    </style>
    </head>
    <body>
    <div name="docname" id="docid1" onClick="bgcolor()"></div>
    <div name="docname" id="docid2" onClick="bgcolor()"></div>
    </body>
    </html>
    <script language="javascript" type="text/javascript">
    <!--
    function bgcolor(){
    var docnObj=document.getElementsByTagName("div");
    docnObj[0].style.backgroundColor = "black";
    docnObj[1].style.backgroundColor = "black";
    }
    -->
    </script>

    posted on 2007-08-07 19:08 劉錚 閱讀(497) 評論(0)  編輯  收藏 所屬分類: JavaScript

    <2025年5月>
    27282930123
    45678910
    11121314151617
    18192021222324
    25262728293031
    1234567

    導航

    統計

    留言簿(1)

    文章分類(141)

    文章檔案(147)

    搜索

    最新評論

    主站蜘蛛池模板: aaa毛片视频免费观看| 午夜无遮挡羞羞漫画免费| 亚洲免费中文字幕| 成人免费午夜视频| 国产免费牲交视频免费播放 | 久久久久久国产a免费观看黄色大片| 亚洲色欲色欲www在线播放| 国产成人毛片亚洲精品| 国产福利视精品永久免费 | 成人免费a级毛片无码网站入口| 色妞www精品视频免费看| 亚洲国产一区国产亚洲| 免费观看国产精品| 1000部夫妻午夜免费 | 国内外成人免费视频| 黄网站免费在线观看| 亚洲AV电影天堂男人的天堂| 亚洲成人中文字幕| 免费人成在线观看播放国产 | 特级毛片在线大全免费播放| 亚洲国产一区在线观看| 久久久久亚洲av成人无码电影| 国产成在线观看免费视频| 久久不见久久见免费影院www日本| 欧洲 亚洲 国产图片综合| 亚洲av无码成h人动漫无遮挡| 国产精品久久久久影院免费| 最近中文字幕完整免费视频ww| 国产久爱免费精品视频 | 亚洲免费视频网址| 亚洲午夜久久久影院| 国产成人免费a在线视频app| 四虎在线成人免费网站| a级成人毛片免费图片| 国产大陆亚洲精品国产| 亚洲中文字幕无码av| 亚洲国产成人手机在线电影bd| 亚洲国产精品SSS在线观看AV| 亚洲欧洲中文日韩av乱码| 日韩免费三级电影| 无限动漫网在线观看免费 |