欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

復(fù)雜的javascript窗口分幀解析

 更新時(shí)間:2016年02月19日 09:29:57   作者:Jolly2015  
這篇文章主要為大家詳細(xì)解析了復(fù)雜的javascript窗口分幀,什么是窗口分幀,JavaScript中幀窗口之間的關(guān)系,感興趣的小伙伴們可以參考一下

什么是窗口分幀?  

    窗口分幀就是把一個(gè)瀏覽器文檔窗口分隔成多個(gè)窗口,每個(gè)窗口都可以顯示一個(gè)獨(dú)立的網(wǎng)頁(yè)文件,每個(gè)幀(即頁(yè)面)都有自己的url。

幀窗口該如何創(chuàng)建?

  幀通常是由<frameset>和<frame>標(biāo)記創(chuàng)建的。但在HTML 4中,<iframe>標(biāo)記也可以用來(lái)在文檔中創(chuàng)建“內(nèi)聯(lián)幀”。就JavaScript來(lái)說(shuō),<iframe>創(chuàng)建的幀與<frameset>和<frame>創(chuàng)建的幀一樣。

  在HTML中用<frameset>(分割窗口標(biāo)記)來(lái)分割窗口,<frameset>在多窗口頁(yè)面中的地位就相當(dāng) 于<body>在普通單窗口頁(yè)面中的地位,在頁(yè)面中用<frameset>……</frameset>標(biāo)志頁(yè)面主體 部分的起止位置。而且,<frameset>標(biāo)記決定了怎樣劃分窗口,以及每個(gè)窗口的位置和大小。其基本語(yǔ)法結(jié)構(gòu)如下:

<frameset cols=n rows=n frameborder=yes|no border=n bordercolor=#n framespacing=n></frameset>

  cols和rows:是決定頁(yè)面如何分割的兩個(gè)參數(shù)。分割左右窗口用cols,各幀的左右寬度用占窗口寬度的百分比來(lái)表示。比 如:cols="30%,40%,*"就表示水平方向分割成三個(gè)窗口,各自所占總寬度的百分比依次是30%,40%和30%。其中"*"表示剩余部分,也 就是說(shuō)"*"對(duì)應(yīng)的小窗口寬度為剩余的寬度。分割上下窗口用rows,同樣采用百分比的設(shè)定方法。

  frameborder:是指定各分窗口是(ye)否(no)要加邊框;如果加過(guò)框的話(huà),則用 border參數(shù)指定邊框的寬度,bordercolor指定邊框的顏色。

  framespacing:用于設(shè)定各分窗口之間的間隔大小,默認(rèn)值是0。

  用<frameset>標(biāo)記把窗口分割好后,各窗口的屬性是用HTML的<frame>標(biāo)記來(lái)定義的,所以<frameset>標(biāo)記中必須包含<frame>標(biāo)記,用以定義各分窗口的屬性。其語(yǔ)法如下:

<frame align=left|center|right|top|bottomv name=framename src=url noresize scrolling=y(tǒng)es|on|auto frameborder=yes|no bordercolor=#n marginheight=n marginwidth=n></frame>

  align:設(shè)定分窗口的位置是靠左(left)、靠右(right)、居中(center)、靠上(top)還是靠底(bottom)。

  name:用于指定分窗口的名稱(chēng),src則用于指定分窗口所對(duì)應(yīng)的HTML頁(yè)面地址。

  noresize:是對(duì)用戶(hù)來(lái)說(shuō)的,當(dāng)<frame>標(biāo)記中包含此參數(shù)的時(shí)候,用戶(hù)就不能用鼠標(biāo)調(diào)整修改各分窗口的大小。

  scrolling:設(shè)定分窗口是否要滾動(dòng)條。scrolling=no時(shí)不要滾動(dòng)條,scrolling=y(tǒng)es時(shí)表示要滾動(dòng)條,scrolling=auoto時(shí)表示根據(jù)實(shí)際情況自動(dòng)設(shè)置滾動(dòng)條。

  frameborder和bordercolor:是設(shè)定分窗口有無(wú)邊框和邊框顏色的。但對(duì)象只限于用<frame>標(biāo)記的分窗口。

  marginheight和marginwidth:分別用于設(shè)定分窗口的上下邊緣和左右邊緣的寬度。

  例如:

<frameset cols="50%,*,25%">
 <frame src="http://www.baidu.com" noresize="noresize" />
 <frame src="http://www.baidu.com" />
 <frame src="http://www.baidu.com" />
</frameset>

JavaScript中幀窗口之間的關(guān)系?
  一個(gè)窗口的任何幀可以通過(guò)top,framesparent屬性來(lái)引用其他幀。

  任何窗口或幀中的JavaScript代碼可以將自己的窗口和幀引用為 window 或 self。

  每個(gè)窗口都有frames屬性。這個(gè)屬性引用一個(gè)Window對(duì)象的數(shù)組,其中每個(gè)元素代表的是這個(gè)窗口中包含的幀(如果一個(gè)窗口沒(méi)有任何幀,那么frames[]數(shù)組就是空的,frames.length為0).這樣,窗口就可以使用frames[0]來(lái)引用它的第一個(gè)幀,使用frames[1]來(lái)引用第二個(gè)幀,一次類(lèi)推。

  每個(gè)窗口還包含有一個(gè)parent屬性,它引用包含這個(gè)窗口的Window對(duì)象。這樣,窗口中的第一個(gè)幀就可以引用它的兄弟幀,即:

 parent.frames[1]

如果一個(gè)窗口是頂級(jí)窗口,而不是幀,那么parent屬性引用的就是這個(gè)窗口本身:  

parent==self;

如果一個(gè)幀包含在另一個(gè)幀中,而后者又包含在頂級(jí)窗口中,那么該幀就可以使用parent.parent來(lái)引用頂級(jí)窗口。

注意事項(xiàng):
分幀不能和body標(biāo)簽及內(nèi)容體共存

分幀不利于搜索引擎優(yōu)化,正常前臺(tái)頁(yè)面不建議使用分幀。

以上就是本文的全部?jī)?nèi)容,希望對(duì)大家學(xué)習(xí)javascript程序設(shè)計(jì)有所幫助。

相關(guān)文章

  • 微信小程序?qū)崿F(xiàn)彈球游戲

    微信小程序?qū)崿F(xiàn)彈球游戲

    這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)彈球游戲,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2022-09-09
  • js換圖片效果可進(jìn)行定時(shí)操作

    js換圖片效果可進(jìn)行定時(shí)操作

    換圖片效果想必大家都有見(jiàn)到過(guò)吧,但是定時(shí)換圖片,貌似就很少見(jiàn)了,下面本文通過(guò)一個(gè)示例為大家詳細(xì)介紹下
    2014-06-06
  • 微信小程序?qū)崿F(xiàn)小型計(jì)算器

    微信小程序?qū)崿F(xiàn)小型計(jì)算器

    這篇文章主要為大家詳細(xì)
    介紹了微信小程序?qū)崿F(xiàn)小型計(jì)算器,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2022-09-09
  • ionic隱藏tabs的方法

    ionic隱藏tabs的方法

    這篇文章主要為大家詳細(xì)介紹了ionic隱藏tabs的方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2016-08-08
  • 利用d3.js制作連線(xiàn)動(dòng)畫(huà)圖與編輯器的方法實(shí)例

    利用d3.js制作連線(xiàn)動(dòng)畫(huà)圖與編輯器的方法實(shí)例

    這篇文章主要給大家介紹了關(guān)于如何利用d3.js制作連線(xiàn)動(dòng)畫(huà)圖與編輯器的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用d3.js具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
    2019-09-09
  • Bootstrap 模態(tài)對(duì)話(huà)框只加載一次 remote 數(shù)據(jù)的完美解決辦法

    Bootstrap 模態(tài)對(duì)話(huà)框只加載一次 remote 數(shù)據(jù)的完美解決辦法

    前端框架 Bootstrap 的模態(tài)對(duì)話(huà)框,可以使用 remote 選項(xiàng)指定一個(gè) URL,這樣對(duì)話(huà)框在第一次彈出的時(shí)候就會(huì)自動(dòng)從這個(gè)地址加載數(shù)據(jù)到 .modal-body 中,但是它只會(huì)加載一次,不過(guò)通過(guò)在事件中調(diào)用 removeData() 方法可以解決這個(gè)問(wèn)題,具體操作方法,大家通過(guò)本文了解下吧
    2017-07-07
  • javascript獲取ckeditor編輯器的值(實(shí)現(xiàn)代碼)

    javascript獲取ckeditor編輯器的值(實(shí)現(xiàn)代碼)

    這篇文章主要介紹了javascript獲取ckeditor編輯器的值,用于表單驗(yàn)證。需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助
    2013-11-11
  • two.js之實(shí)現(xiàn)動(dòng)畫(huà)效果示例

    two.js之實(shí)現(xiàn)動(dòng)畫(huà)效果示例

    本篇文章主要介紹了two.js之實(shí)現(xiàn)動(dòng)畫(huà)效果示例,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2017-11-11
  • 鼠標(biāo)滾軸控制文本框值的JS代碼

    鼠標(biāo)滾軸控制文本框值的JS代碼

    這篇文章主要介紹了鼠標(biāo)滾軸控制文本框值的JS代碼,有需要的朋友可以參考一下
    2013-11-11
  • js編寫(xiě)選項(xiàng)卡效果

    js編寫(xiě)選項(xiàng)卡效果

    這篇文章主要為大家詳細(xì)介紹了js編寫(xiě)選項(xiàng)卡效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2017-05-05

最新評(píng)論