中文字幕人成人乱码亚洲电影_ 讓插入到innerhtml的script跑起來(lái)

讓插入到innerhtml的script跑起來(lái)

在做 ajax 編程時(shí)，我們常常需要將 xmlhttp 獲取到的頁(yè)面內容通過(guò) innerHTML 來(lái)賦給某個(gè)容器（比如 div、span 或者 td 等），但是這里存在一個(gè)問(wèn)題，就是我們將要賦給 innerHTML 的頁(yè)面內容如果包含有腳本程序，這些腳本程序不管是外部腳本，還是內部腳本，可能(1)都不會(huì )被執行。這個(gè)問(wèn)題在某些時(shí)候微不足道，甚至可以忽略，但有些時(shí)候，這個(gè)問(wèn)題就非常嚴重，它很可能讓我們的程序得不到預期的結果。因此我們需要解決這個(gè)問(wèn)題。

如果你讀過(guò) MSDN，你會(huì )發(fā)現并非所有插入到 innerHTML 中的腳本都不能執行，如果這段腳本的 script 標簽中包含了 defer 屬性，IE 會(huì )正確的執行這些腳本程序。但不幸的是，Moziila/Firefox 和 Opera 可不吃這一套，不管 script 標簽有沒(méi)有設置 defer 屬性，這些瀏覽器都不會(huì )向 IE 那樣去執行插入到 innerHTML 中的腳本。

但不管腳本是否被執行了，有一點(diǎn)我們可以肯定，那就是這些腳本確實(shí)被插入到了 innerHTML 中，如果不相信，你可以 alert 一下看看。但如果你真的 alert 了，你也可能會(huì )發(fā)現有一種例外情況存在，那就是如果腳本在 innerHTML 內容開(kāi)頭的話(huà)，那么 IE 瀏覽器將會(huì )忽略掉這段腳本，而 Moziila/Firefox 和 Opera 卻不會(huì )。

好了，問(wèn)題分析的差不多了，我們來(lái)看看如何解決吧。

解決的思路其實(shí)很簡(jiǎn)單，那就是將插入到 innerHTML 中的所有腳本取出來(lái)，然后一一執行。不過(guò)我們先要解決上面的兩個(gè)問(wèn)題。

先來(lái)看第一個(gè)問(wèn)題，如何避免在 IE 中重復執行 innerHTML 中帶有 defer 屬性的腳本。這個(gè)很容易，只需要先確定瀏覽器是否是 IE，然后再檢測將要執行的腳本是否帶有 defer 屬性即可。需要注意的是，在判斷 IE 瀏覽器時(shí)，我們需要避免被 opera 的瀏覽器識別欺騙。這一點(diǎn)我們在后面的代碼中將會(huì )看到它是如何做的。

接下來(lái)，看 IE 忽略 innerHTML 開(kāi)頭腳本的問(wèn)題，這個(gè)也很容易解決。只需要在要插入到 innerHTML 中的內容的開(kāi)頭附加一段不是腳本的內容，就可以了。但不要試圖附加一個(gè)空內容的標簽，或者空格、回車(chē)、換行等，這將不起作用，開(kāi)頭的腳本仍然會(huì )被忽略。也不要試圖附加，雖然這可以讓開(kāi)頭的腳本不再被忽略，但這個(gè) 仍然會(huì )影響原有內容的顯示，雖然你可能覺(jué)得不明顯，但是對于挑剔的用戶(hù)來(lái)說(shuō)，這可能是無(wú)法容忍的。因此，為了讓附加的內容既可以起到避免開(kāi)頭腳本被忽略的功能，又不會(huì )造成不良影響，我們將附加這么一段內容：

<span style="display: none">hack ie</span>
雖然上面這段內容有一定的長(cháng)度，但是它并不會(huì )顯示，而且這個(gè)插入的標簽沒(méi)有 id 也沒(méi)有 name，所以也不會(huì )跟原來(lái)內容中的某些標簽的 id 或者 name 產(chǎn)生沖突。不過(guò)這里有一點(diǎn)要注意，這里也要判斷是否是 IE，然后再決定加不加這段內容，因為其他某些瀏覽器可能不支持 display: none 這個(gè) CSS 修飾（例如 Opera Mini），如果加上這段代碼會(huì )影響最終的顯示效果。

下面我們來(lái)看看如何取出腳本并執行。

取出腳本很容易，只需要用 innerHTML 所在對象的 getElementsByTagName 方法就可以了，這個(gè)方法對幾乎所有的容器標簽都管用。取出腳本以后，我們要一一判斷它們是外部腳本還是內部腳本。

先來(lái)看外部腳本，如果是外部腳本，我們選擇了這樣一種方法，即先創(chuàng )建這個(gè)外部腳本的一個(gè)副本對象，并設置它的 defer 屬性為 true（這一點(diǎn)是為了讓 IE 瀏覽器能正確執行），然后用 appendChild 方法將這個(gè)副本對象插入到 head 中。這里你可能會(huì )問(wèn)，為什么不是插入到 innerHTML 所在的對象中呢？插入到 innerHTML 所在的對象中不是更好嗎？如果你試一下就會(huì )知道，如果插入到 innerHTML 所在的對象中，在 IE 瀏覽器中沒(méi)有問(wèn)題，但是在 Mozilla/Firefox 和 Opera 瀏覽器中會(huì )有一些問(wèn)題。問(wèn)題是如果在 Firefox 上這樣做，瀏覽器會(huì )停止響應（這是在 Firefox 1.5 上的測試結果，其他版本是否有此問(wèn)題，尚不得知），而在 Opera 上，腳本會(huì )莫名其妙的執行兩次（這是在 Opera 8.5 上的測試結果，其它版本的 Opera 是否由此問(wèn)題，也尚不得知）。為了避免這些問(wèn)題，所以我選擇了插入到 head 中。

再來(lái)看內部腳本，內部腳本的內容我們可以直接用腳本對象的 text 屬性來(lái)獲取，這里我們使用腳本對象的 text 屬性而不是 innerHTML 屬性，是因為在 Opera 瀏覽器中，腳本對象的 innerHTML 屬性是空的，只有用 text 屬性才能獲取到腳本內容。執行內部腳本直接用 eval 即可。但是腳本可能會(huì )被包含在 HTML 的注釋標簽中，因此我們需要先將注釋標簽去掉，不然在 IE 中會(huì )出錯。

上面的分析看上去很完美了，但是實(shí)際上還是有問(wèn)題，一個(gè)是 document.write 和 document.writeln 的問(wèn)題，這個(gè)問(wèn)題在 Blueidea 上，bound0 給出了一個(gè)思路，就是替換掉默認的 document.write 和 document.writeln 方法，不過(guò)他用的是字符串替換，因此只對內部腳本有效，對外部腳本就沒(méi)辦法了，因此我想了個(gè)更通用的辦法，就是直接把 document.write 和 document.writeln 重新定義，這樣不管內部腳本還是外部腳本執行的就都是我們我們自己定義的 document.write 和 document.writeln 了。不過(guò)也有副作用，就是這兩個(gè)函數在當前頁(yè)面中就不能再像原來(lái)一樣使用了，不過(guò)這兩個(gè)函數在頁(yè)面加載完之后一般是不會(huì )再用到了，因此這里重新定義它們所帶來(lái)的副作用影響很小。但是還有個(gè)問(wèn)題是，盡管這樣，我們仍然無(wú)法保證 document.write 或 document.writeln 輸出的內容會(huì )顯示在最合適的位置，它只是把內容附加到了我們放置內容的容器中。

另一個(gè)問(wèn)題是 eval 引起的問(wèn)題，一個(gè)是 Blueidea 上的 hutia 說(shuō)的作用域的問(wèn)題，另一個(gè)問(wèn)題是如果用 eval 執行的內部腳本的話(huà)，內部腳本會(huì )在外部腳本加載完之前就開(kāi)始執行了。要解決這個(gè)兩個(gè)問(wèn)題可以采用 window.setTimeout 這個(gè)函數，讓每個(gè)腳本都延時(shí)一段后再執行，外部腳本延時(shí)時(shí)間可以設的較長(cháng)，以保證其能夠完全加載，而內部腳本則可以設置為很短，因為一個(gè)腳本執行的時(shí)間通常是很短的，這樣既可以保證不會(huì )改變作用域，又可以基本保證腳本執行順序不會(huì )改變了（這種方法對于保證執行順序上也不一定會(huì ) 100% 有效，如果網(wǎng)絡(luò )非常繁忙，外部腳本可能在設置的時(shí)間內加載不完，但至少比直接用 eval 的時(shí)候好多了）。

——————————–
(1) 注：在這里，我們用了限定詞“可能”，因為有一種情況，腳本會(huì )被執行，在下文中你將會(huì )看到這種情況。

本站僅提供存儲服務(wù)，所有內容均由用戶(hù)發(fā)布，如發(fā)現有害或侵權內容，請點(diǎn)擊舉報。

欧美性猛交XXXX免费看蜜桃,成人网18免费韩国,亚洲国产成人精品区综合,欧美日韩一区二区三区高清不卡,亚洲综合一区二区精品久久

讓插入到innerhtml的script跑起來(lái)