#JavaScript# IE兼容

Me_Kun 發(fā)布于2019-08-23 16:23 / 2458人閱讀

摘要：出現(xiàn)原因在子頁(yè)面關(guān)閉時(shí)，會(huì)釋放掉在子頁(yè)面中聲明賦值的對(duì)象。所以在父頁(yè)面所有對(duì)這個(gè)對(duì)象的引用操作都會(huì)產(chǎn)生這個(gè)錯(cuò)誤。然后在父頁(yè)面中使用變成對(duì)象。

在IE瀏覽器中出現(xiàn)的問(wèn)題

1.不能執(zhí)行已釋放 Script 的代碼

1.bug出現(xiàn)背景：
在使用iframe標(biāo)簽時(shí)，如果子頁(yè)面向父頁(yè)面?zhèn)鬟f在子頁(yè)面創(chuàng)建的對(duì)象（所有對(duì)象，包括數(shù)組，函數(shù)，正則等）時(shí)，會(huì)出現(xiàn)這個(gè)bug。

2.bug出現(xiàn)原因：
在子頁(yè)面關(guān)閉時(shí)，會(huì)釋放掉在子頁(yè)面中聲明賦值的對(duì)象。所以在父頁(yè)面所有對(duì)這個(gè)對(duì)象的引用操作都會(huì)產(chǎn)生這個(gè)JS錯(cuò)誤。

3.解決方法有2種：
第一，在父頁(yè)面把所有對(duì)象都建好，在子頁(yè)面對(duì)這個(gè)對(duì)象進(jìn)行字符串賦值。
第二，如果子頁(yè)面產(chǎn)生的對(duì)象數(shù)量是不定的，使用JSON.stringfy()把要回傳的對(duì)象變成字符串。然后在父頁(yè)面中使用JSON.parse()變成對(duì)象。

IE、firefox瀏覽器下JS的new Date()的值為Invalid Date、NaN-NaN

截圖信息

1.問(wèn)題出現(xiàn)背景：
在IE瀏覽器中，使用new Date("xxxx")方法，將一串日期字符串轉(zhuǎn)換為具體的Date格式的時(shí)，會(huì)出現(xiàn)這個(gè)問(wèn)題。如：
new Date("2019-03-21 10:41:33") //[date] Invalid Date[date] Invalid Date
但是這個(gè)方法卻在谷歌瀏覽器上可以返回正確的結(jié)果。

2.問(wèn)題出現(xiàn)原因：

字符串的格式不被IE瀏覽器識(shí)別，而導(dǎo)致的

3.解決方法：
new Date("2019/03/21 10:41:33") //[date] Thu Mar 21 2019 10:41:33 GMT+0800 (中國(guó)標(biāo)準(zhǔn)時(shí)間)[date] Thu Mar 21 2019 10:41:33 GMT+0800 (中國(guó)標(biāo)準(zhǔn)時(shí)間)

備注：在使用的時(shí)候，我們可以通過(guò)字符串轉(zhuǎn)換的方式，將日期字符串格式轉(zhuǎn)換為瀏覽器支持的格式，在使用new Date()。

var date = "2019-03-21 10:41:33";
date = date.replace(new RegExp(/-/gm) ,"/"); 　　//將所有的"-"轉(zhuǎn)為"/"即可
Date d=new Date(date);

4.總結(jié)
不同的瀏覽器是存在差異的，以下列出了所有瀏覽器都支持的方式。

var d = new Date(2019, 01, 07); // yyyy, mm-1, dd  
 var d = new Date(2019, 01, 07, 11, 05, 00); // yyyy, mm-1, dd, hh, mm, ss  
 var d = new Date("02/07/2019"); // "mm/dd/yyyy"  
var d = new Date("02/07/2019 11:05:00"); // "mm/dd/yyyy hh:mm:ss"  
var d = new Date(1297076700000); // milliseconds  
var d = new Date("Mon Feb 07 2019 11:05:00 GMT"); // ""Day Mon dd yyyy hh:mm:ss GMT/UTC

SCRIPT600:該操作的目標(biāo)元件無(wú)效

問(wèn)題出現(xiàn)背景：
IE6-IE9使用innerHTML進(jìn)行賦值.

問(wèn)題出現(xiàn)原因：
在IE6-IE9中對(duì)Table使用innerHTML時(shí)出現(xiàn)的問(wèn)題。例如：


在JS中我們這么操作他，
document.getElementById("table").innerHTML = "demo"

就回出現(xiàn)上面的問(wèn)題。

問(wèn)題解決方法有三種：

第一：可以換個(gè)添加屬性，如：appendChild

tbody.appendChild = ""

第二：添加判斷

var s = navigator.userAgent.toLowerCase();
          var BrowserInfo = {
                IsIE: /*@cc_on!@*/false,
                IsIE9Under: /*@cc_on!@*/false && (parseInt(s.match(/msie (d+)/)[1], 10) <= 9),
            };

    if( BrowserInfo.IsIE9Under  ){
        tbody.appendChild = "";
    }else{
        tbody.innerHTML = "";
    }

第三：包裝整個(gè)table

var table = ""   
         div.innterHTML = table;
       將最外層table也納入到字符串中，使用div.innerHTML

SCRIPT438: 對(duì)象不支持“indexOf”屬性或方法---for IE8

原因：IE8不支持indexOf() 這個(gè)方法
解決方法：

if(!Array.indexOf) {
    Array.prototype.indexOf = function(obj) {             
        for(var i=0; i

IE8 select 下拉不能垂直居中
在IE8中l(wèi)ine-height失效。
解決方法：
 select{
    padding:10px 0;
}
禁用瀏覽器的默認(rèn)返回鍵
在IE10+ 和 chrome中我們可以使用下面的代碼禁用瀏覽器的默認(rèn)返回鍵
//防止頁(yè)面后退 不兼容IE8~9
(function () {
    if (window.history && window.history.pushState) {
        history.pushState(null, null, document.URL);
        window.onpopstate = function () {
            history.pushState(null, null, document.URL);
        }
    }
})()
下面的問(wèn)題是我們來(lái)解決如何讓IE8~9的返回鍵禁用
背景描述以及解決思路參考https://every-best.iteye.com/...，因?yàn)闆](méi)有下載到源碼，所以就根據(jù)作者的思考自己寫(xiě)了下。
分析：
 窗口A跳轉(zhuǎn)到B窗口，而窗口B下有iframe且其src=C.html，而iframe中讓頁(yè)面C跳轉(zhuǎn)到頁(yè)面D。如果使用后退按鈕，首先是在iframe中頁(yè)面從D回到C，主窗口沒(méi)有變化，再繼續(xù)回退的話，然后是窗口B回到窗口A。
從中我們可以總結(jié)到
 IE會(huì)將iframe的跳轉(zhuǎn)記錄在歷史記錄中，而使用回退，其對(duì)應(yīng)歷史記錄僅使用在iframe上，可是不會(huì)對(duì)主窗口進(jìn)行回退。
如果在最終D頁(yè)面的情況下不允許再回退跳轉(zhuǎn)了，禁用其后退按鈕，推薦下面的解決方案：
在D中引入iframe E 而E中自動(dòng)跳轉(zhuǎn)f。利用IE對(duì)iframe的變化也記錄在歷史記錄的特點(diǎn)，這樣在每次回退的時(shí)候，都只有iframe E中在變化，而E 又自動(dòng)跳轉(zhuǎn)F ，這樣歷史記錄又填回IE里面去了，就導(dǎo)致其D不能進(jìn)行回退。
 //解決IE8~9 瀏覽器返回鍵禁止使用兼容問(wèn)題  

 //第一步在頁(yè)面D中新建一個(gè)iframe，初始化SRC=bank.html
    var createFrame = function (context) {
        if (!("pushState" in history)) {
            var iframe = document.createElement("iframe");
            iframe.src = "../bank.html";
            iframe.style.display = "none";
            context.appendChild(iframe);
        }
    }
  //第二步 在頁(yè)面bank.html中，讓iframe進(jìn)行自動(dòng)跳轉(zhuǎn)
  
 
備注：
一定要設(shè)置iframe.style.display = "none";讓其不顯示，這樣就可以神不知鬼不覺(jué)了。