IE9不能直接引用Console

IMDZ發表於2019-02-16

問題:

公司有個專案,功能很簡單,讀取業務資料,展示在頁面上。

一個很簡單的問題,卻因為目標瀏覽器是IE9,卡了三天。

前端給的反饋是:

在IE9下,程式一會兒對,一會兒不對……第一次刷不出來,多刷幾次就刷出來了。

這些話,聽著就覺得怪,如果聽之任之,就成了不明就裡一筆糊塗賬。

於是,我開始跟他們一起除錯,就在大家快要放棄的時候,我發現,這個“一會兒對,一會兒不對”跟console物件的引用有關,只要把引用了console物件的語句註釋掉,指令碼的執行結果就總是正確,反之,就“一會兒對,一會兒不對”。

BUG找到了,但我還是覺得這個console得徹底搞清楚,不然還得至少踩兩三年的坑。

Does IE9 support console.log, and is it a real function?

In Internet Explorer 9 (and 8), the console object is only exposed when the developer tools are opened for a particular tab. If you hide the developer tools window for that tab, the console object remains exposed for each page you navigate to. If you open a new tab, you must also open the developer tools for that tab in order for the console object to be exposed.

真不知道這傢伙從哪學會的祕籍,這麼詭異的現象,即便自己發現了,也不敢這樣總結。

結論:

IE9不能直接引用console,一旦語句中出現console引用,後面的程式碼就不再執行了,console就像個黑洞,把光都吸走了,無影無蹤。

一旦你想要藉助Development Tools去除錯一下,看看是不是console引用出了問題,IE9就會馬上建立一個console物件,然後這個BUG就不見了!這時候你關掉Development Tools,console依然還在……下次你再開啟新頁面,console又成了黑洞。

如果沒有旁人的幫助,不大可能從這個坑裡爬出來的,我們只能告訴客戶,程式在IE9中執行的結果是“一會對,一會兒不對,好像是隨機的……”。

解決方法:

window.console複製給console

console = window.console || {};

然後再給這個空的console物件,新增一些空的方法,讓它們在IE9以及其他不支援console的瀏覽器上不要拋異常,好讓我們的程式順利執行。

相關文章