復雜的javascript窗口分幀解析

2019-11-20 10:34:02

字體：大中小

來源：轉載

供稿：網友

什么是窗口分幀？　　

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

幀窗口該如何創建？

　　幀通常是由<frameset>和<frame>標記創建的。但在HTML 4中，<iframe>標記也可以用來在文檔中創建“內聯幀”。就JavaScript來說，<iframe>創建的幀與<frameset>和<frame>創建的幀一樣。

　　在HTML中用<frameset>（分割窗口標記）來分割窗口，<frameset>在多窗口頁面中的地位就相當于<body>在普通單窗口頁面中的地位，在頁面中用<frameset>……</frameset>標志頁面主體部分的起止位置。而且，<frameset>標記決定了怎樣劃分窗口，以及每個窗口的位置和大小。其基本語法結構如下：

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

　　cols和rows：是決定頁面如何分割的兩個參數。分割左右窗口用cols，各幀的左右寬度用占窗口寬度的百分比來表示。比如：cols="30%,40%,*"就表示水平方向分割成三個窗口，各自所占總寬度的百分比依次是30%，40%和30%。其中"*"表示剩余部分，也就是說"*"對應的小窗口寬度為剩余的寬度。分割上下窗口用rows，同樣采用百分比的設定方法。

　　frameborder：是指定各分窗口是（ye）否（no）要加邊框；如果加過框的話，則用 border參數指定邊框的寬度，bordercolor指定邊框的顏色。

　　framespacing：用于設定各分窗口之間的間隔大小，默認值是0。

　　用<frameset>標記把窗口分割好后，各窗口的屬性是用HTML的<frame>標記來定義的，所以<frameset>標記中必須包含<frame>標記，用以定義各分窗口的屬性。其語法如下：

<frame align=left|center|right|top|bottomv name=framename src＝url noresize scrolling＝yes|on|auto frameborder=yes|no bordercolor＝＃n marginheight=n marginwidth＝n></frame>

　　align：設定分窗口的位置是靠左（left）、靠右（right）、居中（center）、靠上（top）還是靠底（bottom）。

　　name：用于指定分窗口的名稱，src則用于指定分窗口所對應的HTML頁面地址。

　　noresize：是對用戶來說的，當<frame>標記中包含此參數的時候，用戶就不能用鼠標調整修改各分窗口的大小。

　　scrolling：設定分窗口是否要滾動條。scrolling=no時不要滾動條，scrolling＝yes時表示要滾動條，scrolling＝auoto時表示根據實際情況自動設置滾動條。

　　frameborder和bordercolor：是設定分窗口有無邊框和邊框顏色的。但對象只限于用<frame>標記的分窗口。

　　marginheight和marginwidth：分別用于設定分窗口的上下邊緣和左右邊緣的寬度。

　　例如：

<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中幀窗口之間的關系？
　　一個窗口的任何幀可以通過top,frames和parent屬性來引用其他幀。

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

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

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