快捷導(dǎo)航

復(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,frames和parent屬性來(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è)幀就可以引用它的兄弟幀，即: