解讀IE和firefox下JScript和HREF的執(zhí)行順序
很久都沒有寫關(guān)于代碼方面的文章了。主要原因還是因為最近的工作都集中在需求分析方面,沒有了現(xiàn)實中的感觸,就沒有了寫作的動機。討論一個關(guān)于JScript執(zhí)行順序的問題。示例代碼如下:
a.htm
<A onmouseup="func('onmouseup')" href="b.htm">Click Me!</A> <A onclick="func2('onclick')" href="d.htm">Click Me!</A> <SPAN id=msg></SPAN>
<SCRIPT>
function func(str)
{
msg(str);
window.location.href="c.htm";
}
function msg(str)
{
document.getElementById("msg").innerText=str; //A
//alert(str); //B
}
function func2(str)
{
msg(str);
window.location.href="e.htm";
}
</SCRIPT>
在msg(str)有個注釋掉的行,試驗的時候分別執(zhí)行A和B。
| A | B | |||
| onmouseup | onclick | onmouseup | onclick | |
| IE | b.htm | d.htm | c.htm | d.htm |
| FireFox | c.htm->b.htm | e.htm->d.htm | c.htm->b.htm | e.htm->d.htm |
上表主要列出了兩個瀏覽器中的執(zhí)行順序,紅色代表頁面腳本跳轉(zhuǎn)的頁面,藍色是Anchor標簽的href屬性。從上面可以看出,對于FireFox,始終先執(zhí)行頁面腳本,然后瀏覽器再跳轉(zhuǎn)。而IE里面執(zhí)行的過程卻有差別:
1、使用后退按鈕直接回到a.htm,即頁面只執(zhí)行了一個跳轉(zhuǎn);
2、在使用alert中斷的情況下,onmouseup執(zhí)行了頁面腳本中的跳轉(zhuǎn)。
從上可以看出,
1、對于FireFox而言,頁面腳本執(zhí)行順序始終優(yōu)先于瀏覽器內(nèi)嵌腳本執(zhí)行順序,這個已經(jīng)很明顯了。
2、IE中,HREF的執(zhí)行順序為onmouseup->href->onclick。真的嗎?
為了更加明確2中的執(zhí)行順序,我們繼續(xù)分析onclick和href的執(zhí)行順序關(guān)系。在上述例子中,onclick是采用調(diào)入的方式執(zhí)行的。如果a. 我們使用以下的測試代碼:
<a href="d.htm" onclick="return false;">Click Me!</a>
發(fā)現(xiàn)HREF不能被執(zhí)行。
b. 如果我們使用以下測試代碼:
<a href="d.htm" onclick="window.location.href='e.htm';return false;">Click Me!</a>
發(fā)現(xiàn)依舊執(zhí)行HREF的d.htm,而不是onclick中的e.htm。
c. 如果我們使用以下測試代碼:
<a href="d.htm" onclick="msg('onclick');return false;">Click Me!</a>( function msg()的代碼如上)
發(fā)現(xiàn)執(zhí)行了function msg(),而HREF不被觸發(fā)。
暈了。IE的確是個詭異的東西。誰能幫忙解釋一下b例中的現(xiàn)象?
相關(guān)文章
JS定時器使用,定時定點,固定時刻,循環(huán)執(zhí)行詳解
下面小編就為大家?guī)硪黄狫S定時器使用,定時定點,固定時刻,循環(huán)執(zhí)行詳解。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-05-05
JS監(jiān)聽和響應(yīng)DOM元素的變化的方法
在前端開發(fā)中,處理動態(tài)變化的 DOM(文檔對象模型)很是常見的需求,比如自動化測試中,可能需要監(jiān)控 DOM 變化來驗證測試條件,在用戶填寫表單時,某些字段需要即時驗證等,所以本文給大家介紹了JS監(jiān)聽和響應(yīng)DOM元素的變化的方法,需要的朋友可以參考下2024-09-09
用javascript實現(xiàn)在小方框中瀏覽大圖的代碼
用javascript實現(xiàn)在小方框中瀏覽大圖的代碼...2007-08-08

