問題描述：
在 IE 中不能使用 const 關(guān)鍵字聲明變量；
兼容處理：
不使用 const ，以 var 代替。
（3）CSS的"float"屬性訪問
問題描述：
訪問一個(gè)給定CSS 值的最基本句法是：.style.，但部分CSS屬性跟中的保留字命名相同，如"float"，“for”，"class"等，不同瀏覽器寫法不同。
在IE中這樣寫：
.(“”).style. = “l(fā)eft”;
在中這樣寫：
.(“”).style. = “l(fā)eft”;
兼容處理：
在寫之前加一個(gè)判斷，判斷瀏覽器是否是IE：
if(document.all){
document.getElementById("header").style.styleFloat = "left";
}
else{
document.getElementById("header").style.cssFloat = "left";
}
（4）訪問
問題描述：
和"float"屬性一樣，同樣需要使用不現(xiàn)的句法區(qū)分來訪問
在IE中這樣寫：
var myObject = document.getElementById("myLabel");
var myAttribute = myObject.getAttribute("htmlFor");
在中這樣寫:
var myObject = document.getElementById("myLabel");
var myAttribute = myObject.getAttribute("for");
兼容處理：
解決的方法也是先 判斷瀏覽器類型。
（5）訪問和設(shè)置class屬性
問題描述：
同樣由于class是保留字的原因，這兩種瀏覽器使用不同的 方法來獲取這個(gè)屬性。
IE8.0之前的所有IE版本的寫法：
var myObject = document.getElementById("header");
var myAttribute = myObject.getAttribute("className");
適用于IE8.0 以及 的寫法：
var myObject = document.getElementById("header");
var myAttribute = myObject.getAttribute("class");
另外，在使用()設(shè)置Class屬性的時(shí)候，兩種瀏覽器也存在同樣的差異。
setAttribute("className",value);
這種寫法適用于IE8.0之前的所有IE版本，注意：IE8.0也不支持""屬性了。
(“class”,value);適用于IE8.0 以及 。
兼容處理：
方法一，兩種都寫上：
var myObject = document.getElementById("header");
myObject.setAttribute("class","classValue");
myObject.setAttribute("className","classValue");
//設(shè)置header的class為classValue
方法二，IE和FF都支持object.className，所以可以這樣寫：
var myObject = document.getElementById("header");
myObject.className="classValue";//設(shè)置header的class為classValue
方法三，先判斷瀏覽器類型，再根據(jù)瀏覽器類型采用對(duì)應(yīng)的寫法。
二、DOM方法及對(duì)象引用
問題描述：
在中，按鈕沒反應(yīng)，在IE中，就可以，因?yàn)閷?duì)于IE來說，一個(gè)HTML 元素的 ID 可以直接在腳本中當(dāng)作變量名來使用，而中不可以。
兼容處理：
盡量采用W3C DOM 的寫法，訪問對(duì)象的時(shí)候，用.(“id”) 以ID來訪問對(duì)象，且一個(gè)ID在頁(yè)面中必須是唯一的，同樣在以標(biāo)簽名來訪問對(duì)象的時(shí)候，用.(“div”)[0] 。該方式得到較多瀏覽器的支持。
集合類對(duì)象訪問
問題描述：
IE下，可以使用()或[]獲取集合類對(duì)象；下，只能使用[]獲取集合類對(duì)象
document.write(document.forms("formName").src);
//該寫法在IE下能訪問到Form對(duì)象的scrc屬性
兼容處理：
將document.forms("formName")改為 document.forms["formName"]。統(tǒng)一使用[]獲取集合類對(duì)象。
frame的引用
問題描述：
IE可以通過id或者name訪問這個(gè)frame對(duì)應(yīng)的對(duì)象，
而只可以通過name來訪問這個(gè)frame對(duì)應(yīng)的對(duì)象。
例如如果上述frame標(biāo)簽寫在最上層的里面的htm里面，那么可以這樣訪問：
IE： .或者.來訪問這個(gè)對(duì)象；
：只能這樣.來訪問這個(gè)對(duì)象。
兼容處理：
使用frame的name來訪問frame對(duì)象，另外，在IE和中都可以使用..(””)來訪問這個(gè)frame對(duì)象。
問題描述：
IE中支持使用和獲取父節(jié)點(diǎn)。而只可以使用。
兼容處理：
因?yàn)榕cIE都支持DOM，因此統(tǒng)一使用來訪問父節(jié)點(diǎn)。
table操作
問題描述：
IE下table中無論是用還是插入都沒有效果，而其他瀏覽器卻顯示正常。
兼容處理：
將加到table的 元素中，如下面所示：
var row = document.createElement("tr");
var cell = document.createElement("td");
var cell_text = document.createTextNode("插入的內(nèi)容");
cell.appendChild(cell_text);
row.appendChild(cell);
document.getElementsByTagName("tbody")[0].appendChild(row);
移除節(jié)點(diǎn)()和()
問題描述：
在IE和下都能正常使用，但是只能在IE下用。
方法的功能是刪除一個(gè)節(jié)點(diǎn)，語(yǔ)法為node.（false）或者node.（true），返回值是被刪除的節(jié)點(diǎn)。
（false）表示僅僅刪除指定節(jié)點(diǎn)，然后這個(gè)節(jié)點(diǎn)的原孩子節(jié)點(diǎn)提升為原雙親節(jié)點(diǎn)的孩子節(jié)點(diǎn)。
（true）表示刪除指定節(jié)點(diǎn)及其所有下屬節(jié)點(diǎn)。被刪除的節(jié)點(diǎn)成為了孤立節(jié)點(diǎn)，不再具有有孩子節(jié)點(diǎn)和雙親節(jié)點(diǎn)。
兼容處理：
中節(jié)點(diǎn)沒有方法，只能用方法代替，先回到父節(jié)點(diǎn)，在從父節(jié)點(diǎn)上移除要移除的節(jié)點(diǎn)：
node..(node); // 為了在ie和下都能正常使用，取上一層的父結(jié)點(diǎn)，然后。
獲取的節(jié)點(diǎn)
問題描述：
的下標(biāo)的含義在IE和中不同
兼容處理：
方法一，獲取子節(jié)點(diǎn)時(shí)，可以通過node.getElementsByTagName()來回避這個(gè)問題。但是 getElementsByTagName對(duì)復(fù)雜的DOM結(jié)構(gòu)遍歷明顯不如用childNodes，因?yàn)閏hildNodes能更好的處理DOM的層次結(jié)構(gòu)。
方法二，在實(shí)際運(yùn)用中，F(xiàn)irefox在遍歷子節(jié)點(diǎn)時(shí)，不妨在for循環(huán)里加上：
if(childNode.nodeName=="#text") continue;//或者使用nodeType == 1。
不能對(duì)支持
問題描述：
不支持，它支持來實(shí)現(xiàn)js中瀏覽器的兼容問題，不過沒有像一樣考慮元素的方式，所以不完全與IE兼容。如果不用，字符串里面不包含HTML代碼也可以用代替。
兼容處理：
通過判斷瀏覽器類型來兼容：
if(document.all){
document.getElementById('element').innerText = "my text";
} else{
document.getElementById('element').textContent = "my text";
}
三、事件處理 .event
問題描述：
function et()
{
alert(event);//IE: [object]
}
以上代碼在IE運(yùn)行的結(jié)果是[object]，而在Firefox無法運(yùn)行。
因?yàn)樵贗E中event作為對(duì)象的一個(gè)屬性可以直接使用，但是在中卻使用了W3C的模型，它是通過傳參的方法來傳播事件的，也就是說你需要為你的函數(shù)提供一個(gè)事件響應(yīng)的接口。
兼容處理：
添加對(duì)event判斷，根據(jù)瀏覽器的不同來得到正確的event：
function et()
{
evt=evt?evt:(window.event?window.event:null);
//兼容IE和Firefox
alert(evt);
}
鍵盤值的取得
問題描述：
IE和獲取鍵盤值的方法不同，可以理解，下的event.which與IE下的event.相當(dāng)。
兼容處理：
function myKeyPress(evt){
//兼容IE和Firefox獲得keyBoardEvent對(duì)象
evt = (evt) ? evt : ((window.event) ? window.event : "")
//兼容IE和Firefox獲得keyBoardEvent對(duì)象的鍵值
var key = evt.keyCode?evt.keyCode:evt.which;
if(evt.ctrlKey && (key == 13 || key == 10)){
//同時(shí)按下了Ctrl和回車鍵
//do something;
}
}
事件源的獲取
問題描述：
在使用事件委托的時(shí)候，通過事件源獲取來判斷事件到底來自哪個(gè)元素，
但是，
在IE下，event對(duì)象有屬性，但是沒有屬性；
下，even對(duì)象有屬性，但是沒有屬性。
兼容處理：
ele=function(evt){ //捕獲當(dāng)前事件作用的對(duì)象
evt=evt||window.event;
return
(obj=event.srcElement?event.srcElement:event.target;);
}
事件監(jiān)聽
問題描述：
在事件監(jiān)聽處理方面：
IE提供了和兩個(gè)接口，
而提供的是和。
兼容處理：
最簡(jiǎn)單的兼容性處理就是封裝這兩套接口：
function addEvent(elem, eventName, handler) {
if (elem.attachEvent) {
elem.attachEvent("on" + eventName, function(){
handler.call(elem)});
//此處使用回調(diào)函數(shù)call()，讓this指向elem
} else if (elem.addEventListener) {
elem.addEventListener(eventName, handler, false);
}
}
function removeEvent(elem, eventName, handler) {
if (elem.detachEvent) {
elem.detachEvent("on" + eventName, function(){
handler.call(elem)});
//此處使用回調(diào)函數(shù)call()，讓this指向elem
} else if (elem.removeEventListener) {
elem.removeEventListener(eventName, handler, false);
}
}
需要特別注意，下，事件處理函數(shù)中的this指向被監(jiān)聽元素本身，而在IE下則不然,可使用回調(diào)函數(shù)call，讓當(dāng)前上下文指向監(jiān)聽的元素。
鼠標(biāo)位置
問題描述：
IE下，even對(duì)象有x，y屬性，但是沒有pageX，pageY屬性；
下，even對(duì)象有pageX，pageY屬性，但是沒有x，y屬性。
兼容處理：
使用 mX(mX = event.x ? event.x : event.pageX;) 來代替IE下的event.x或者下的event.pageX。復(fù)雜點(diǎn)還要考慮絕對(duì)位置。
function getAbsPoint(e){
var x = e.offsetLeft, y = e.offsetTop;
while (e = e.offsetParent) {
x += e.offsetLeft;
y += e.offsetTop;
}
alert("x:" + x + "," + "y:" + y);
}
6、..href 問題
問題描述：
IE或者.0.x下js中瀏覽器的兼容問題，可以使用.或..href；.5.x下，只能使用.。
兼容處理：
使用 . 來代替 ..href。當(dāng)然也可以考慮使用 .()方法。
7、事件委托方法
問題描述：
IE下，使用 .body. = ; 其中 ()在這之前已被實(shí)現(xiàn)；
在下，使用 .body. = ();
兼容處理：
統(tǒng)一使用 .body.οnlοad=new (‘()’);
或者 .body. = (){/* 這里是代碼 */}
四、其他差異的兼容處理
問題描述：
new ActiveXObject("Microsoft.XMLHTTP");只在IE中起作用，F(xiàn)irefox不支持，但支持XMLHttpRequest。
兼容處理：
function createXHR() {
var xhr=null;
if(window.XMLHttpRequest){
xhr=new ActiveXObject("Msxml2.XMLHTTP");
}else{
try {
xhr=new ActiveXObject("Microsoft.XMLHTTP");
}
catch() {
xhr=null;
}
}
if(!xhr)return;
return xhr;
}
模態(tài)和非模態(tài)窗口
問題描述：
IE中可以通過和打開模態(tài)和非模態(tài)窗口，但是不支持。
兼容處理：
直接使用.open(,name,)方式打開新窗口。 如果需要傳遞參數(shù)，可以使用frame或者。
input.type屬性問題
IE下 input.type屬性為只讀，但是下可以修改
對(duì)元素的操作
設(shè)置，IE和寫法不同：
Firefox:可直接設(shè)置：option.text = 'foooooooo';
IE:只能設(shè)置：option.innerHTML = 'fooooooo';
刪除一個(gè)的的方法：
Firefox:可以
select.options.remove(selectedIndex);
IE7:可以用
select.options[i] = null;
IE6:需要寫
select.options[i].outerHTML = null;
img 對(duì)象 alt 和 title 的解析
問題描述：
img對(duì)象有alt和title兩個(gè)屬性，區(qū)別在于，alt：當(dāng)照片不存在或者load錯(cuò)誤時(shí)的提示。
title：照片的tip說明, 在IE中如果沒有定義title，alt也可以作為img的tip使用，但是在中，兩者完全按照標(biāo)準(zhǔn)中的定義使用
兼容處理：
最好將alt和title對(duì)象都寫全，保證在各種瀏覽器中都能正常使用 。
img 的 src 刷新問題
問題描述：
<img id="pic" onclick= "this.src= 'a.jpg'" src="aa.jpg" style="cursor: pointer"/>
在IE 下，這段代碼可以用來刷新圖片，但在下不行。主要是緩存問題。
兼容處理：
在地址后面加個(gè)隨機(jī)數(shù)就解決了:
<img id="pic" onclick= "javascript:this.src=this.src+'?'
+Math.random()"src="a.jpg" style="cursor: pointer"/>