IE和FireFox(FF)中js和css的不同
更新時間:2009年04月13日 11:49:24 作者:
整理了一點IE和FF下的不同點,歡迎大家補充
在IE和FireFox(FF)中js和css的不同
css:
1.
ul標簽中FF中有個padding值,卻沒有margin值,而在IE中正好相反
解決辦法:將ul的padding和margin都設為0(也可以不是0)如:padding:0;margin:0;list-style:none;
js:
1.
IE中innerText在FF中沒有,使用textContent;
eg:
var obj=document.getElementById("_td");
var text;
if(obj.innerText) {
text=obj.innerText;
} else if(obj.textContent) {
text=obj.textContent;
}
2.
在Ajax中返回對象狀態(tài)IE可以使用readystate但是在FF中必須為readyState,所以最好是都寫成readyState
3.獲取IE和FF中的鍵盤返回值,
<input type="text" onkeyUp="test(event)"/>
function test(e) {
var keyc=GetKeyCode(e);
alert(keyc);
}
function GetKeyCode(e) {//取得不同瀏覽器下的鍵盤事件值
var keyc;
if(window.event) {//ie鍵盤事件
keyc=e.keyCode;
} else if (e.which) {//火狐
keyc=e.which;
}
return keyc;
}
4.為對象添加移除事件
var obj=document.getElementById("_tname');
添加事件:
if(obj.attachEvent) {
obj.attachEvent("onchange",function() {
otherfunction(params);//這里可以給其實方法傳參,也可以直接調用其它方法
});
} else if(obj.addEventListener) {
obj.addEventListener("change",function() {
otherfunction(params);
},false);
}
移除事件:
obj.onclick=null;
/*下面的代碼為什么不行,IE下輸出obj.onclick竟然為anonymous,希望高手能幫忙解決
if(obj.detachEvent) {
obj.detachEvent("onchange",test);
} else if(obj.removeEventListener) {
obj.removeEventListener("change",test,false);
}*/
5.
IE中event.x和event.y
在FF中只有event.pageX,event.pageY
都有event.clientX和event.clientY屬性
解決辦法:
var x=e.x?e.x:e.pageX;//e為event對象傳進來的參數(shù)
6.IE下 input.type屬性為只讀,但是MF下可以修改
7.在 IE 中,getElementsByName()、(document.all[name] (還未測試成功))均不能用來取得 div元素(是否還有其它不能取的元素還不知道)。
8.通過js來觸發(fā)事件
<script type="text/javascript"><!--
function handerToClick(){
var obj=document.getElementById("btn1");
if(document.all){//IE中
obj.fireEvent("onclick");
} else {
var e=document.createEvent('MouseEvent');
e.initEvent('click',false,false);
obj.dispatchEvent(e);
}
}
// --></script>
<input type="button" value="btn1" id="btn1" onclick=" alert('按鈕btn1的click事件') " />
<input type="button" value="觸發(fā)ID為btn1的onclick事件" onclick=" handerToClick() " />
9.IE下event對象有srcElement屬性,Firefox下,event對象有target屬性
var obj=e.srcElement?e.srcElement:e.target;//e為event對象傳進來的參數(shù)
//從這里下面的還未測試
10.在FF中自己定義的屬性必須getAttribute()取得
11.節(jié)點問題
IE中使用parentElement parement.children,而FF中使用parentNode parentNode.childNodes
childNodes的下標的含義在IE和FF中不同,F(xiàn)F使用DOM規(guī)范,childNodes中會插入空白文本節(jié)點。
FF中節(jié)點沒有removeNode方法,必須使用如下方法 node.parentNode.removeChild(node)
css:
1.
ul標簽中FF中有個padding值,卻沒有margin值,而在IE中正好相反
解決辦法:將ul的padding和margin都設為0(也可以不是0)如:padding:0;margin:0;list-style:none;
js:
1.
IE中innerText在FF中沒有,使用textContent;
eg:
復制代碼 代碼如下:
var obj=document.getElementById("_td");
var text;
if(obj.innerText) {
text=obj.innerText;
} else if(obj.textContent) {
text=obj.textContent;
}
2.
在Ajax中返回對象狀態(tài)IE可以使用readystate但是在FF中必須為readyState,所以最好是都寫成readyState
3.獲取IE和FF中的鍵盤返回值,
<input type="text" onkeyUp="test(event)"/>
function test(e) {
var keyc=GetKeyCode(e);
alert(keyc);
}
function GetKeyCode(e) {//取得不同瀏覽器下的鍵盤事件值
var keyc;
if(window.event) {//ie鍵盤事件
keyc=e.keyCode;
} else if (e.which) {//火狐
keyc=e.which;
}
return keyc;
}
4.為對象添加移除事件
var obj=document.getElementById("_tname');
添加事件:
if(obj.attachEvent) {
obj.attachEvent("onchange",function() {
otherfunction(params);//這里可以給其實方法傳參,也可以直接調用其它方法
});
} else if(obj.addEventListener) {
obj.addEventListener("change",function() {
otherfunction(params);
},false);
}
移除事件:
obj.onclick=null;
/*下面的代碼為什么不行,IE下輸出obj.onclick竟然為anonymous,希望高手能幫忙解決
if(obj.detachEvent) {
obj.detachEvent("onchange",test);
} else if(obj.removeEventListener) {
obj.removeEventListener("change",test,false);
}*/
5.
IE中event.x和event.y
在FF中只有event.pageX,event.pageY
都有event.clientX和event.clientY屬性
解決辦法:
var x=e.x?e.x:e.pageX;//e為event對象傳進來的參數(shù)
6.IE下 input.type屬性為只讀,但是MF下可以修改
7.在 IE 中,getElementsByName()、(document.all[name] (還未測試成功))均不能用來取得 div元素(是否還有其它不能取的元素還不知道)。
8.通過js來觸發(fā)事件
<script type="text/javascript"><!--
function handerToClick(){
var obj=document.getElementById("btn1");
if(document.all){//IE中
obj.fireEvent("onclick");
} else {
var e=document.createEvent('MouseEvent');
e.initEvent('click',false,false);
obj.dispatchEvent(e);
}
}
// --></script>
<input type="button" value="btn1" id="btn1" onclick=" alert('按鈕btn1的click事件') " />
<input type="button" value="觸發(fā)ID為btn1的onclick事件" onclick=" handerToClick() " />
9.IE下event對象有srcElement屬性,Firefox下,event對象有target屬性
var obj=e.srcElement?e.srcElement:e.target;//e為event對象傳進來的參數(shù)
//從這里下面的還未測試
10.在FF中自己定義的屬性必須getAttribute()取得
11.節(jié)點問題
IE中使用parentElement parement.children,而FF中使用parentNode parentNode.childNodes
childNodes的下標的含義在IE和FF中不同,F(xiàn)F使用DOM規(guī)范,childNodes中會插入空白文本節(jié)點。
FF中節(jié)點沒有removeNode方法,必須使用如下方法 node.parentNode.removeChild(node)
相關文章
javascript游戲開發(fā)之《三國志曹操傳》零部件開發(fā)(二)人物行走的實現(xiàn)
上一講我們談到了如何讓靜態(tài)人物變?yōu)閯討B(tài),今天我們來談談如何使人物移動,感興趣的朋友可以了解下哦,順便鞏固一下animate方法的應用,希望本文對你有所幫助2013-01-01JavaScript中你不得不知道的Promise高級用法分享
在JavaScript中,Promise是一種解決異步編程問題的重要方式,本文主要來和大家探討一下23個Promise的高級用法,每一個都在JavaScript的海洋中航行,讓開發(fā)者們能夠以更高效、優(yōu)雅的方式處理異步操作,希望對大就有所幫助2023-12-12JavaScript獲取偽元素(Pseudo-Element)屬性的方法技巧
這篇文章主要介紹了JavaScript獲取偽元素(Pseudo-Element)屬性的方法技巧,本文直接給出實現(xiàn)代碼,需要的朋友可以參考下2015-03-03純js網頁畫板(Graphics)類簡介及實現(xiàn)代碼
今天需要在網頁上畫一個圖譜,想到用JS,經過學習,和網上搜索,經過整理優(yōu)化得到下面代碼,注意不是用HTML5的canvas,而是用的純js,需要了解的朋友可以參考下2012-12-12javascript 密碼框防止用戶粘貼和復制的實現(xiàn)代碼
本篇文章主要是對javascript 密碼框防止用戶粘貼和復制的實現(xiàn)代碼進行了介紹,需要的朋友可以過來參考下,希望對大家有所幫助2014-02-02使用JS的DOM文檔對象模型獲取前端循環(huán)的參數(shù)
這篇文章主要介紹了使用JS的DOM(文檔對象模型)獲取前端循環(huán)的參數(shù),本文結合實例代碼給大家介紹的非常詳細,需要的朋友可以參考下2023-02-02