設為首頁

收藏本站

導覽首頁 | 新登場    ◇聯盟溫泉 | 民宿 | 人力銀行 | 女性 |

類型:js_article

詳細講解JavaScript腳本語言的 document 對像網頁
對像屬性

<divcode_title>代碼
<divcode_div>
<divdp-highlighter>
<oldp-j>
<lialt>document.title              <spancomment>//設置文檔標題等價於html的<title>標籤  
document.bgcbor            <spancomment>//設置頁面背景色  
<lialt>document.fgcbor            <spancomment>//設置前景色(文本顏色)  
document.linkcbor          <spancomment>//未點擊過的鏈接顏色  
<lialt>document.alinkcbor         <spancomment>//激活鏈接(焦點在此鏈接上)的顏色  
document.vlinkcbor         <spancomment>//已點擊過的鏈接顏色  
<lialt>document.url                <spancomment>//設置url屬性從而在同一窗口打開另一網頁  
document.filecreateddate    <spancomment>//文件建立日期,只讀屬性  
<lialt>document.filemodifieddate   <spancomment>//文件修改日期,只讀屬性  
document.filesize           <spancomment>//文件大小,只讀屬性  
<lialt>document.cookie             <spancomment>//設置和讀出cookie  
document.charset            <spancomment>//設置字符集 簡體中文:gb2312  
<script type=text/javascript>render_code();</script>

對像方法

<divcode_title>代碼
<divcode_div>
<divdp-highlighter>
<oldp-j>
<lialt>document.write()                   <spancomment>//動態向頁面寫入內容  
document.createelbent(tag)        <spancomment>//創建一個html標籤對像  
<lialt>document.getelbentbyid(id)        <spancomment>//獲得指定id值的對象  
document.getelbentsbyname(name)   <spancomment>//獲得指定name值的對象  
<script type=text/javascript>render_code();</script>

images集合(頁面中的圖像)

a)通過集合引用

<divcode_title>代碼 <divcode_div>
<divdp-highlighter>
<oldp-j>
<lialt>document.images              <spancomment>//對應頁面上的<img>標籤  
document.images.length       <spancomment>//對應頁面上<img>標籤的個數  
<lialt>document.images[<spannumber>0]           <spancomment>//第1個<img>標籤             
document.images[i]           <spancomment>//第i-1個<img>標籤  
<script type=text/javascript>render_code();</script>

b)通過nane屬性直接引用

<divcode_title>代碼 <divcode_div>
<divdp-highlighter>
<oldp-j>
<lialt><img name=<spanstring>"oimage">  
    document.images.oimage       <spancomment>//document.images.name屬性  
<script type=text/javascript>render_code();</script>

c)引用圖片的src屬性

<divcode_title>代碼 <divcode_div>
<divdp-highlighter>
<oldp-j>
<lialt>document.images.oimage.src   <spancomment>//document.images.name屬性.src  [/li] <script type=text/javascript>render_code();</script>

d)創建一個圖像

<divcode_title>代碼 <divcode_div>
<divdp-highlighter>
<oldp-j>
<lialt>var oimage  
oimage = <spankeyword>new image()  
<lialt>document.images.oimage.src=<spanstring>"/1.jpg"  
<script type=text/javascript>render_code();</script>

同時在頁面上建立一個<img>標籤與之對應就可以顯示

<divcode_title>代碼 <divcode_div>
<divdp-highlighter>
<oldp-xml>
<lialt><spantag><<spantag-name>html<spantag>>  
<spantag><<spantag-name>img <spanattribute>name=<spanattribute-value>oimage<spantag>>  
<lialt><spantag><<spantag-name>script <spanattribute>language=<spanattribute-value>"javascript"<spantag>>  
    var oimage  
<lialt>    <spanattribute>oimage = <spanattribute-value>new image()  
    <spanattribute>document.images.oimage.src=<spanattribute-value>"/1.jpg"  
<lialt><spantag></<spantag-name>script<spantag>>  
<spantag></<spantag-name>html<spantag>>  
<script type=text/javascript>render_code();</script>

forms集合(頁面中的表單)

a)通過集合引用

<divcode_title>代碼 <divcode_div>
<divdp-highlighter>
<oldp-j>
<lialt>document.forms                  <spancomment>//對應頁面上的<form>標籤  
document.forms.length           <spancomment>//對應頁面上<form>標籤的個數  
<lialt>document.forms[<spannumber>0]               <spancomment>//第1個<form>標籤  
document.forms[i]               <spancomment>//第i-1個<form>標籤  
<lialt>document.forms[i].length        <spancomment>//第i-1個<form>中的控件數  
document.forms[i].elbents[j]   <spancomment>//第i-1個<form>中第j-1個控件  
<script type=text/javascript>render_code();</script>

b)通過標籤name屬性直接引用

<divcode_title>代碼 <divcode_div>
<divdp-highlighter>
<oldp-xml>
<lialt><spantag><<spantag-name>form <spanattribute>name=<spanattribute-value>"myform"<spantag>><spantag><<spantag-name>input <spanattribute>name=<spanattribute-value>"myctrl"<spantag>><spantag></<spantag-name>form<spantag>>  
document.myform.myctrl          //document.表單名.控件名  
<script type=text/javascript>render_code();</script><divcode_title>代碼 <divcode_div>
<divdp-highlighter>
<oldp-xml>
<lialt><spantag><<spantag-name>html<spantag>>  
<spancomments><!--text控件相關script-->  
<lialt><spantag><<spantag-name>form <spanattribute>name=<spanattribute-value>"myform"<spantag>>  
<spantag><<spantag-name>input <spanattribute>type=<spanattribute-value>"text" <spanattribute>name=<spanattribute-value>"otext"<spantag>>  
<lialt><spantag><<spantag-name>input <spanattribute>type=<spanattribute-value>"password" <spanattribute>name=<spanattribute-value>"opswd"<spantag>>  
<spantag><<spantag-name>form<spantag>>  
<lialt><spantag><<spantag-name>script <spanattribute>language=<spanattribute-value>"javascript"<spantag>>  
//獲取文本密碼框的值  
<lialt>document.write(document.myform.otext.value)  
document.write(document.myform.opswd.value)  
<lialt><spantag></<spantag-name>script<spantag>>  
<spantag></<spantag-name>html<spantag>>  
<script type=text/javascript>render_code();</script><divcode_title>代碼 <divcode_div>
<divdp-highlighter>
<oldp-xml>
<lialt><spantag><<spantag-name>html<spantag>>  
<spancomments><!--select控件相關script-->  
<lialt><spantag><<spantag-name>form <spanattribute>name=<spanattribute-value>"myform"<spantag>>  
<spantag><<spantag-name>select <spanattribute>name=<spanattribute-value>"oselect"<spantag>>  
<lialt><spantag><<spantag-name>option <spanattribute>value=<spanattribute-value>"1"<spantag>>1<spantag></<spantag-name>option<spantag>>  
<spantag><<spantag-name>option <spanattribute>value=<spanattribute-value>"2"<spantag>>2<spantag></<spantag-name>option<spantag>>  
<lialt><spantag><<spantag-name>option <spanattribute>value=<spanattribute-value>"3"<spantag>>3<spantag></<spantag-name>option<spantag>>  
<spantag></<spantag-name>select<spantag>>  
<lialt><spantag></<spantag-name>form<spantag>>  
  
<lialt><spantag><<spantag-name>script <spanattribute>language=<spanattribute-value>"javascript"<spantag>>  
    //遍歷select控件的option項  
<lialt>    var length  
    <spanattribute>length=<spanattribute-value>document.myform.oselect.length  
<lialt>    for(<spanattribute>i=<spanattribute-value>0;i<spantag><<spantag-name>length;i++)  
    document.write(document.myform.oselect[i].value)  
<lialt><spantag></<spantag-name>script<spantag>>  
  
<lialt><spantag><<spantag-name>script <spanattribute>language=<spanattribute-value>"javascript"<spantag>>  
    //遍歷option項並且判斷某個option是否被選中  
<lialt>    for(<spanattribute>i=<spanattribute-value>0;i<spantag><<spantag-name>document.myform.oselect.length;i++){  
    if(document.myform.oselect[i].selected!=true)  
<lialt>    document.write(document.myform.oselect[i].value)  
    else  
<lialt>    document.write("<spantag><<spantag-name>font <spanattribute>cbor=<spanattribute-value>red<spantag>>"+document.myform.oselect[i].value+"<spantag></<spantag-name>font<spantag>>")     
    }  
<lialt><spantag></<spantag-name>script<spantag>>  
  
<lialt><spantag><<spantag-name>script <spanattribute>language=<spanattribute-value>"javascript"<spantag>>  
    //根據selectedindex打印出選中的option  
<lialt>    //(0到document.myform.oselect.length-1)  
    <spanattribute>i=<spanattribute-value>document.myform.oselect.selectedindex  
<lialt>    document.write(document.myform.oselect[i].value)  
<spantag></<spantag-name>script<spantag>>  
<lialt>  
<spantag><<spantag-name>script <spanattribute>language=<spanattribute-value>"javascript"<spantag>>  
<lialt>    //動態增加select控件的option項  
    var <spanattribute>ooption = <spanattribute-value>document.createelbent("option");  
<lialt>    <spanattribute>ooption.text=<spanattribute-value>"4";  
    <spanattribute>ooption.value=<spanattribute-value>"4";  
<lialt>    document.myform.oselect.add(ooption);  
<spantag></<spantag-name>script<spantag>>  
<lialt><spantag><<spantag-name>html<spantag>>  
<script type=text/javascript>render_code();</script>


<divcode_title>代碼 <divcode_title>  <divcode_div>
<divdp-highlighter>
<oldp-xml>
<lialt><spantag><<spantag-name>div <spanattribute>id=<spanattribute-value>"odiv"<spantag>>text<spantag></<spantag-name>div<spantag>>  
  document.all.odiv                        //引用圖層odiv  
<lialt>  document.all.odiv.style                   
  <spanattribute>document.all.odiv.style.display=<spanattribute-value>""       //圖層設置為可視  
<lialt>  <spanattribute>document.all.odiv.style.display=<spanattribute-value>"none"   //圖層設置為隱藏  
<script type=text/javascript>render_code();</script>

/*document.all表示document中所有對象的集合
只有ie支持此屬性,因此也用來判斷瀏覽器的種類*/ 


主旨:

內容:




104休閒信箱 2.3.0 © 104mm.com 2001 - 2018. 您尚未登錄
Page generated in 0.02187419 seconds with 3 Queries