JS的document.all函數使用樣本

來源:互聯網
上載者:User

標籤:pre   rip   java   har   顯示   charset   nbsp   好的   bsp   

  JS的document.all函數雖然被document.getElement......代替,但是在使用中還是較為常見,下面為大家詳細介紹下具體的使用樣本:

  一:
  document.all是頁面內所有元素的一個集合。例如: 
  document.all(0)表示頁面內第一個元素 
  二:
  document.all可以判斷瀏覽器是否是IE 

                   if(document.all){                     alert("is IE!");                   } 

  三:
  也可以通過給某個元素設定id屬性(id=aaaa),然後用document.all.aaaa調用該元素 

  四:案例

    代碼1:

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>    </head>    <body>        <input name="aaa" value="111">         <input id="bbb" value="222">         <script>             console.log(document.all.aaa.value) //根據name取value             console.log(document.all.bbb.value) //根據id取 value         </script>     </body></html>

    代碼2:

    但是常常name可以相同(如:用checkbox取使用者的多項愛好的情況) ;

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>    </head>    <body>        <input name="aaa" value="111">         <input name="aaa" value="222">         <input id="bbb" value="bbb">         <script>             console.log(document.all.aaa[0].value) //最終顯示a1            console.log(document.all.aaa[1].value) //最終顯示a2            console.log(document.all.bbb[0].value) //最終會報錯        </script>     </body></html>

    代碼3:

    理論上一個頁面中的id是互不相同的,如果出現不同tags有相同的id,document.all.id 就會失敗,就象這樣:

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>    </head>    <body>        <input id="aaa" value="111">         <input id="aaa" value="222">        <script>             console.log(document.all.aaa.value)        </script>     </body></html>

    代碼4:

  對於一個複雜的頁面(代碼很長,或者id是由程式自動產生),或著一個javascript初學者寫的程式,很有可能出現兩個tags有相同id的情況。為了編程的時候不出錯,我推薦這樣的寫法:

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>    </head>    <body>        <input id="aaa" value="aaa1">         <input id="aaa" value="aaa2">        <input name="bbb" value="bbb1">         <input name="bbb" value="bbb2">        <input id="ccc" value="ccc1">         <input name="ddd" value="ddd1">         <script>             console.log(document.all("aaa",0).value);             console.log(document.all("aaa",1).value);             console.log(document.all("bbb",0).value);             console.log(document.all("bbb",1).value);             console.log(document.all("ccc",0).value);             console.log(document.all("ddd",0).value);         </script>     </body></html>

?

JS的document.all函數使用樣本

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.