今天花費了3個小時，解決一個bug，結果在使用IETESTER的時候，出現了一個奇怪的現象：
連最基本的alert都無法顯示，非常糾結，老以為是我的寫法出現了問題，在IE7，IE8下面不相容，
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title></head><script type="text/javascript">function testmethod() {alert('onclick');}</script><body><button onclick="testmethod()" >test</button> </body></html>
使用者在IE6，IE9裡面點擊test，都可以彈出onclick框，但是在IE7，IE8裡面，就出現問題了，我修改查看了很多資料，老以為是我的寫法有問題，原先，我是寫的<a>
我為什麼會發現這個問題呢，是這樣的，原先不是這樣寫的：
請教你一個問題 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><frameset cols="280px,*" framespacing="0" frameborder="0"> <frame src="a.html" scrolling="yes"> <frame src="b.html" scrolling="yes"></frameset><noframes></noframes></frameset></html> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title></head><body>test</body></html> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title></head><body><a href="javascript:void ;" onclick="alert('onclick');return false;">onclick</a></body></html>
第一個是C.html
第二個是a.html
第三個是b.html
OK,你就用IE TEST，訪問c.html
在IE6,7,8,9中，IE6，9是OK的，7,8，是不OK的，原來是以為frameset的問題，或者我的link上面的方法有問題，於是尋找了很多資料：
部分轉帖如下：（http://hi.baidu.com/snailzzz/blog/item/342ecf52a7751f020df3e359.html）
寫法分析世界永遠沒那麼簡單，在當今JavaScript如日中天的Web世界裡，連結a經常用來觸發js事件：
<a href="" onclick="something()">test 1</a>
<a href="#" onclick="something();return false">>test 2</a>
<a href="javascript: void(0)" onclick="something()">>test 3</a>
<a href="javascript: void something()">test 4</a>
首先，第一種寫法在ie下是有問題的，原因是 ie下會自動補全href.
第二種寫法直接在onclick事件中阻止掉預設事件，因此href="#"中的#實際上可以為任意值。用#，是考慮沒有js時，點擊後停留在本頁（注意：當a在一屏以下時，這種寫法會導致頁面復原到頂部）。
第三種寫法，href值是一個javascript偽協議，void是javascript的一個一元操作符（比如!, typeof）。void操作符的作用是，只執行後面的運算式，不返回任何值。看起來好像是void(0)阻止了預設事件，實際上，下面這些寫法都沒問題：
<a href="javascript: void(1)" onclick="something()">>test 3</a>
<a href="javascript:;" onclick="something()">>test 3</a>
<a href="javascript:" onclick="something()">>test 3</a>
<a href="javascript: return true" onclick="something()">>test 3</a>
因為a的預設操作就是javascript偽協議的內容，裡面加不加void都不會觸發其它事件。（注意：Opera下，當偽協議裡有傳回值時，會改變href, 因此我們一般寫void(0)或空語句）
理解了第三種寫法，第四種寫法也就明白了：href="javascript: void something()". 這種寫法有一個“好處”是，滑鼠懸浮時，使用者可以通過狀態列看到將要執行的函數。對開發人員來說，這或許是個好處，但對普通使用者來說，這真的會增加信賴感嗎？抑或是恐懼感？沒有資料，無法下結論。
除了上面的寫法，還有一種推薦的寫法是，通過class或id給a增加一個hook，然後在js裡通過hook來添加事件。
下面轉帖如下：http://www.cnblogs.com/tianguook/archive/2010/06/24/1764235.html
Frame、iFrame、NoFrame的區別和使用Frame、iFrame、NoFrame的區別和使用
<FRAMESET> <FRAME>
<NOFRAMES>
<IFRAME>
■ 架構概念 ：
所謂架構便是網頁畫面分成幾個框窗，同時取得多個 URL。只需要 <FRAMESET> <FRAME> 即可，而所有架構標記需要放在一個總起的 html 檔，這個檔案只記錄了該架構如何劃分，不會顯示任何資料，所以不必放入 <BODY> 標記，瀏覽這架構必須讀取這檔 案而不是其它框窗的檔案。<FRAMESET> 是用以劃分框窗，每一框窗由一個 <FRAME> 標 記所標示，<FRAME>必須在 <FRAMESET> 範圍中使用。如下例：
<frameset cols="50%,*">
<frame name="hello" src="up2u.html">
<frame name="hi" src="me2.html">
</frameset>
此例中 <FRAMESET> 把畫面分成左右兩相等部分，左便是顯示 up2u.html，右邊則會顯示 me2.html 這檔案，<FRAME> 標記所標示的框窗永遠是按由上而下、由左至右的次序。
■ <FRAMESET> <FRAME> ：
<FRAMESET> 稱架構標記，用以宣告HTML檔案為架構模式，並設定視窗如何分割。
<FRAME> 則只是設定某一個框窗內的參數屬性。
<FRAMESET> 參數設定：
例子：<frameset rows="90,*" frameborder="0" border=0 framespacing="2" bordercolor="#008000">
COLS="90,*"
垂直切割畫面(如分左右兩個畫面)，接受整數值、百分數， * 則代表佔用餘下空 間。數值的個數代表分成的視窗數目且以逗號分隔。例如COLS="30,*,50%" 可以 切成三個視窗，第一個視窗是 30 pixels 的寬度，為一絕對分割，第二個視窗是當 分配完第一及第三個視窗後剩下的空間，第三個視窗則占整個畫面的 50% 寬度 為 一相對分割。您可自己調整數字。
ROWS="120,*"
就是橫向切割，將畫面上下分開，數值設定同上。唯 COLS 與 ROWS 兩參數盡量不要同在一個 <FRAMESET> 標記中，因 Netacape 偶然不能顯示這類形的架構，盡量採用多重分割。
frameborder="0"
設定架構的邊框，其值只有 0 和 1 ， 0 表示不要邊框， 1 表示要顯示邊框。（避 免使用 yes 或 no ）
border="0"
設定架構的邊框厚度，以 pixels 為單位。
bordercolor="#008000"
設定架構的邊框顏色。
framespacing="5"
表示架構與架構間的保留空白的距離。
<FRAME> 參數設定：
例子：<frame name="top" src="a.html" marginwidth="5" marginheight="5" scrolling="Auto" frameborder="0" noresize framespacing="6" bordercolor="#0000FF">
SRC="a.html"
設定此框窗中要顯示的網頁設定檔名稱，每個框窗一定要對應著一個網頁檔案。你可 使用絕對路徑或相對路徑。
NAME="top"
設定這個框窗的名稱，這樣才能指定架構來作連結，必須但任意命名。
frameborder=0
設定架構的邊框，其值只有 0 和 1 ， 0 表示不要邊框， 1 表示要顯示邊框。（避 免使用 yes 或 no ）
framespacing="6"
表示架構與架構間的保留空白的距離。
bordercolor="#008000"
設定架構的邊框顏色。
scrolling="Auto"
設定是否要顯示捲軸，YES 表示要顯示捲軸，NO 表示無論如何都不要顯示， AUTO是視情況顯示。
noresize
設定不讓使用者可以改變這個框框的大小，亦沒有設定此參數，使用者可以很隨 意地拉動架構，改變其大小。
marginhight=5
表示架構高度部份邊緣所保留的空間。
marginwidth=5
表示架構寬度部份邊緣所保留的空間。
以下是一些例子
例子 HTML Code
<frameset cols="150,*">
<frameset rows="80,*">
<frame name="upper_left" src="a.html">
<frame name="lower_left" src="b.html">
</frameset>
<frame name="right" src="c.html">
</frameset>
■ <NOFRAMES> ：
當別人使用的瀏覽器太舊，不支援架構這個功能時，他看到的將會是一片空白。為了避免這種情況，可使用 <NOFRAMES> 這個標記，當使用者的瀏覽器看不到架構時，他就會看到 <NOFRAMES> 與 </NOFRAMES> 之間的內容，而不是一片空白。這些內容可以是提醒 瀏覽轉用新的瀏覽器的字句，甚至是一個沒有架構的網頁或能自動切換至沒有架構的版本 亦可。
應用方法：
在<frameset> 標記範圍加入 </NOFRAMES> 標記，以下是一個例子：
<frameset rows="80,*">
<noframes>
<body>
很抱歉，閣下使用的瀏覽器不支援架構功能，請轉用新的瀏覽器。
</body>
</noframes>
<frame name="top" src="a.html">
<frame name="bottom" src="b.html">
</frameset>
若瀏覽器支援架構，那麼它不會理會 <noframes> 中的東西，但若瀏覽器不支援架構，由於不認識所有架構標記，不明的標記會被略過，標記包圍的東西便被解讀出來，所以放在 <noframes>範圍內的文字會被顯示。
■ <IFRAME> ：
這標記只適用於 IE(comet:也使用於FireFox)。 它的作用是在一頁網頁中間插入一個框窗以顯示另一個檔案。它是 一個圍堵標記，但圍著的字句只有在瀏覽器支援 iframe 標記時才會顯示，如<noframes> 一樣，可以放些提醒字句之類。通常 iframe 配合一個辨認瀏覽器的 JavaScript 會較好，若 JavaScript 認出該瀏覽器並非 Internet Explorer 便會切換至另一版本。PS：一定要使用</iframe>關閉，否則後面的內容顯示不出來。
<iframe> 的參數設定如下：
例子： <iframe src="iframe.html" name="test" align="MIDDLE" width="300" height="100" marginwidth="1" marginheight="1" frameborder="1" scrolling="Yes"> </iframe>
src="iframe.html"
欲顯示於此框窗的檔案來源除設定檔名稱，必要加上相對或絕對路徑。
name="test"
此框窗名稱，這是連結標記的 target 參數所需要的，
align="MIDDLE"
可選值為 left, right, top, middle, bottom，作用不大
width="300" height="100"
框窗的寬及長，以 pixels 為單位。
marginwidth="1" marginheight="1"
該插入的檔案與框邊所保留的空間。
frameborder="1"
使用 1 表示顯示邊框， 0 則不顯示。（可以是 yes 或 no）
scrolling="Yes"
使用 Yes 表示容許捲動（內定）， No 則不容許捲動。
■ <FRAME> 與 <IFRAME>區別
1、frame不能脫離frameSet單獨使用，iframe可以；
2、frame不能放在body中；
3、嵌套在frameSet中的iframe必需放在body中；如下可以正常顯示：
<body>
<frameset>
<iframe name="frame1" src="test1.htm"/>
<iframe name="frame2" src="test2.htm"/>
</frameset>
</body>
如下不能正常顯示：
<!--<body>-->
<frameset>
<iframe name="frame1" src="test1.htm"/>
<iframe name="frame2" src="test2.htm"/>
</frameset>
<!--</body>-->
4、不嵌套在frameSet中的iframe可以隨意使用；
如下均可以正常顯示：
<body>
<iframe name="frame1" src="test1.htm"/>
<iframe name="frame2" src="test2.htm"/>
</body>
<!--<body>-->
<iframe name="frame1" src="test1.htm"/>
<iframe name="frame2" src="test2.htm"/>
<!--</body>-->
5、frame的高度只能通過frameSet控制；iframe可以自己控制，不能通過frameSet控制，如：
<!--<body>-->
<frameset rows="50%,*">
<frame name="frame1" src="test1.htm"/>
<frame name="frame2" src="test2.htm"/>
</frameset>
<!--</body>-->
<body>
<frameset>
<iframe height="30%" name="frame1" src="test1.htm"/>
<iframe height="100" name="frame2" src="test2.htm"/>
</frameset>
</body>
6、如果在同一個頁面使用了兩個以上的iframe，在IE中可以正常顯示，在firefox中只能顯示出第一個；使用兩個以上的frame在IE和firefox中均可正常
7、frame是分欄的,而iframe是嵌入到頁面的，frame是一個架構裡面的架構頁，而架構需要全螢幕顯示，不是像一般網頁可以定760的寬度，而且frame不能用於表格之內，而只是把頁面進行劃分。 所以如果需要插入內嵌的頁面，就一般要用iframe，iframe很方便地插入頁面
無語了，不好測試IE7的問題了。看來要使用虛擬機器了。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
