DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> AJAX入門 >> AJAX詳解 >> 如何讓插入到innerHTML中的script運行
如何讓插入到innerHTML中的script運行
編輯:AJAX詳解     

在做 AJax 編程時,我們常常需要將 XMLhttp 獲取到的頁面內容通過 innerHTML 來賦給某個容器(比如 div、span 或者 td 等),但是這裡存在一個問題,就是我們將要賦給 innerHtml 的頁面內容如果包含有腳本程序,這些腳本程序不管是外部腳本,還是內部腳本,可能(1)都不會被執行。這個問題在某些時候微不足道,甚至可以忽略,但有些時候,這個問題就非常嚴重,它很可能讓我們的程序得不到預期的結果。因此我們需要解決這個問題。

如果你讀過 MSDN,你會發現並非所有插入到 innerHTML 中的腳本都不能執行,如果這段腳本的 script 標簽中包含了 defer 屬性,IE 會正確的執行這些腳本程序。但不幸的是,Moziila/Firefox 和 Opera 可不吃這一套,不管 script 標簽有沒有設置 defer 屬性,這些浏覽器都不會向 IE 那樣去執行插入到 innerHtml 中的腳本。

但不管腳本是否被執行了,有一點我們可以肯定,那就是這些腳本確實被插入到了 innerHTML 中,如果不相信,你可以 alert 一下看看。但如果你真的 alert 了,你也可能會發現有一種例外情況存在,那就是如果腳本在 innerHtml 內容開頭的話,那麼 IE 浏覽器將會忽略掉這段腳本,而 Moziila/Firefox 和 Opera 卻不會。

好了,問題分析的差不多了,我們來看看如何解決吧。

解決的思路其實很簡單,那就是將插入到 innerHtml 中的所有腳本取出來,然後一一執行。不過我們先要解決上面的兩個問題。

先來看第一個問題,如何避免在 IE 中重復執行 innerHtml 中帶有 defer 屬性的腳本。這個很容易,只需要先確定浏覽器是否是 IE,然後再檢測將要執行的腳本是否帶有 defer 屬性即可。需要注意的是,在判斷 IE 浏覽器時,我們需要避免被 Opera 的浏覽器識別欺騙。這一點我們在後面的代碼中將會看到它是如何做的。

接下來,看 IE 忽略 innerHTML 開頭腳本的問題,這個也很容易解決。只需要在要插入到 innerHtml 中的內容的開頭附加一段不是腳本的內容,就可以了。但不要試圖附加一個空內容的標簽,或者空格、回車、換行等,這將不起作用,開頭的腳本仍然會被忽略。也不要試圖附加  ,雖然這可以讓開頭的腳本不再被忽略,但這個   仍然會影響原有內容的顯示,雖然你可能覺得不明顯,但是對於挑剔的用戶來說,這可能是無法容忍的。因此,為了讓附加的內容既可以起到避免開頭腳本被忽略的功能,又不會造成不良影響,我們將附加這麼一段內容:

<span style="display: none">hack IEspan>
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved