JS的IE和Firefox兼容性汇编.doc下载(2003) - TOMMYHU - 专注互联网开发及运营技术,提供相关资料及软件下载,奇趣网络时事评论!
Mar 30

JS的IE和Firefox兼容性汇编.doc下载(2003) 不指定

Highslide JS
20100625最新聚合更新 《JS的IE和Firefox兼容性汇编.doc下载(2003)》


JS的IE和Firefox兼容性汇编.doc(2003)
不下载可以直接在本日志阅读
更多阅读:http://www.javaeye.com/wiki/topic/583120
原文出处:http://tieba.baidu.com/f?kz=178881274
感谢“宋纪正”同学的整理工作!

1,document.form.item/document.ID
IE中 document.formName.item(”itemName”)
FF中 document.formName.elements["elementName"]
建议使用document.getElementById(itemName)
2, 下标运算
IE中 document.forms(”formName”)
FF中 document.forms["formName"]
IE中 document.getElementsByName(”inputName”)(1)
FF中 document.getElementsByName(”inputName”)[1]
建议使用[]作为下标运算
3,window.event
IE中 可以使用window.event
FF中 event 只能在事件发生的现场使用,可以改写成 事件=函数(event);
function somemethod(evt) {
evt = evt ? evt : (window.event ? window.event : null);
alert(evt);
}
例如: <input onclick=somemethod(event)>
4,event.x 与 event.y 问题
IE中,event 对象有 x, y 属性
FF中,可用event.clientX ,event.clientY替代(IE也有该属性)
也可用:mX = event.x ? event.x : event.pageX;
5,操作frame
IE中 可以用window.FrameName取得该frame,FF中不行
FF中 可以用window.top.document.getElementById(”frameId”)来访问frame
注:IE和FF都可以通过window.top.document.getElementById(”Frame”).src = ’somefile.htm’来切换frame的 内容,也都可以通过window.top.frameName.location = ’somefile.htm’来切换frame的内容
6,调用showModalDialog
IE中可以用showModalDialog一个子窗口,并获得返回值.
FF中没有showModalDialog,但可以用window.open来实现.
例如:
在Main.cfm文件中有如下代码:
function ShowItemList(Obj){
if (document.all){//IE
var ReturnValue=window.showModalDialog(”ItemList.cfm?Id=341″,”self”,”dialogwidth:500px;status:false”);
if (typeOf(ReturnValue)!=’undefined’){
Obj.value=ReturnValue;
}
}
else{
var subwin=window.open(Item.cfm?id=341,’newWin’,’modal=yes,width=500px’);
}
}
function ReturnValue(ReturnValue){
Obj=document.getElementById(’elementname’);
Obj.value=ReturnValue;
}
如果需要得到返回值.需要用到window.open的参数modal=yes,而且必须在子窗口中向母窗口传值(window.opener).
例如在subwin.cfm中加入以下代码:
function ReturnThisValue(){
window.opener.ReturnValue(document.getElementById(’SelectedItem’).value);
}
7,其它
a, 在FF中,自定义的属性必须使用getAttribute()
b, FF中没有 parentElement parement.children 而用parentNode parentNode.childNodes,可以使用 node.getElementsByTagName()
c, FF不支持onpropertychange事件
d, FF中 createElement不支持HTML代码,可以考虑用:document.write(esHTML);
e, IE 中innerText ,在FF中可以用textContent
f, FF下用class代替IE下的className
g, 如果FF调用obj.focus(); 报错,请尝试改为:window.setTimeout( function(){ obj.focus(); }, 0);
h, firefox不支持 FILTER
i, IE: blur发生在focus后,FF: blur发生在focus前调用
j. IE:event.keyCode=====FF:event.which
function catcathevent(evt)
{
evt = evt ? evt : (window.event ? window.event : null);
if (document.all){
var keyvalue=evt.keyCode;
}
else{
var keyvalue=evt.which;
}
k. 设置容器位置 left、top及长宽,必须加上’px’,如 $(’obj’).style.left = ‘50px’;
l.在FF地址栏中输入about:config,会出现火狐的参数配置设置






1.1 Form对象

现有问题:
现有代码这获得form对象通过document.forms("formName"),这样使用在IE 能接受,FF 不能。

解决方法:
改用 作为下标运算。改为document.forms["formName"]

备注
上述的改用 作为下标运算中的formName是id而name


1.2 HTML对象

现有问题:
在 IE 中,HTML 对象的 ID 可以作为 document 的下属对象变量名直接使用。在 FF 中不能。
document.all("itemName")或者document.all("itemId")

解决方法:
使用对象ID作为对象变量名
document.getElementById("itemId")

备注
document.all是IE自定义的方法,所以请大家尽量不使用。
还有一种方式,在IE和FF都可以使用
var f = document.forms["formName "];
var o = f. itemId;


1.3 DIV对象

现有问题:
在 IE 中,DIV对象可以使用ID作为对象变量名直接使用。在 FF 中不能。
DivId.style.display = "none"

解决方法:
document.getElementById("DivId").style.display = "none"

备注
获得对象的方法不管是不是DIV对象,都使用getElementById方法。参见1.2


1.4 关于frame

现有问题
在 IE中 可以用window.testFrame取得该frame,FF中不行

解决方法
在frame的使用方面FF和IE的最主要的区别是:
如果在frame标签中书写了以下属性:

那么IE可以通过id或者name访问这个frame对应的window对象
而FF只可以通过name来访问这个frame对应的window对象
例如如果上述frame标签写在最上层的window里面的htm里面,那么可以这样访问
IE: window.top.frameId或者window.top.frameName来访问这个window对象
FF:只能这样window.top.frameName来访问这个window对象
另外,在FF和ie中都可以使用window.top.document.getElementById("frameId")来访问frame标签
并且可以通过window.top.document.getElementById("testFrame").src = 'xx.htm'来切换frame的内容
也都可以通过window.top.frameName.location = 'xx.htm'来切换frame的内容


1.5 窗口

现有问题
IE中可以通过showModalDialog和showModelessDialog打开模态和非模态窗口,但是FF不支持。

解决办法
直接使用window.open(pageURL,name,parameters)方式打开新窗口。
如果需要传递参数,可以使用frame或者iframe。


2.1 在JS中定义各种对象变量名时,尽量使用id,避免使用name。
在 IE 中,HTML 对象的 ID 可以作为 document 的下属对象变量名直接使用。在 FF 中不能,所以在平常使用时请尽量使用id,避免只使用name,而不使用id。


2.2 变量名与某 HTML 对象 id 相同的问题

现有问题
在 FF 中,因为对象 id 不作为 HTML 对象的名称,所以可以使用与 HTML 对象 id 相同的变量名,IE 中不能。  

解决方法
在声明变量时,一律加上 var ,以避免歧义,这样在 IE 中亦可正常运行。
此外,最好不要取与 HTML 对象 id 相同的变量名,以减少错误。

以下以 IE 代替 Internet Explorer,以 MF 代替 Mozzila Firefox

1. document.form.item 问题
(1)现有问题:
现有代码中存在许多 document.formName.item("itemName") 这样的语句,不能在 MF 下运行
(2)解决方法:
改用 document.formName.elements["elementName"]
(3)其它
参见 2

2. 集合类对象问题
(1)现有问题:
现有代码中许多集合类对象取用时使用 (),IE 能接受,MF 不能。
(2)解决方法:
改用 [] 作为下标运算。如:document.forms("formName") 改为 document.forms["formName"]。
又如:document.getElementsByName("inputName")(1) 改为 document.getElementsByName("inputName")[1]
(3)其它

3. window.event
(1)现有问题:
使用 window.event 无法在 MF 上运行
(2)解决方法:
MF 的 event 只能在事件发生的现场使用,此问题暂无法解决。可以这样变通:
原代码(可在IE中运行):
<input type="button" name="someButton" value="提交" onclick="javascript:gotoSubmit()"/>
...
<script language="javascript">
function gotoSubmit() {
...
alert(window.event); // use window.event
...
}
</script>

新代码(可在IE和MF中运行):
<input type="button" name="someButton" value="提交" onclick="javascript:gotoSubmit(event)"/>
...
<script language="javascript">
function gotoSubmit(evt) {
evt = evt ? evt : (window.event ? window.event : null);
...
alert(evt); // use evt
...
}
</script>
此外,如果新代码中第一行不改,与老代码一样的话(即 gotoSubmit 调用没有给参数),则仍然只能在IE中运行,但不会出错。所以,这种方案 tpl 部分仍与老代码兼容。

4. HTML 对象的 id 作为对象名的问题
(1)现有问题
在 IE 中,HTML 对象的 ID 可以作为 document 的下属对象变量名直接使用。在 MF 中不能。
(2)解决方法
用 getElementById("idName") 代替 idName 作为对象变量使用。

5. 用idName字符串取得对象的问题
(1)现有问题
在IE中,利用 eval(idName) 可以取得 id 为 idName 的 HTML 对象,在MF 中不能。
(2)解决方法
用 getElementById(idName) 代替 eval(idName)。

6. 变量名与某 HTML 对象 id 相同的问题
(1)现有问题
在 MF 中,因为对象 id 不作为 HTML 对象的名称,所以可以使用与 HTML 对象 id 相同的变量名,IE 中不能。
(2)解决方法
在声明变量时,一律加上 var ,以避免歧义,这样在 IE 中亦可正常运行。
此外,最好不要取与 HTML 对象 id 相同的变量名,以减少错误。
(3)其它
参见 问题4

7. event.x 与 event.y 问题
(1)现有问题
在IE 中,event 对象有 x, y 属性,MF中没有。
(2)解决方法
在MF中,与event.x 等效的是 event.pageX。但event.pageX IE中没有。
故采用 event.clientX 代替 event.x。在IE 中也有这个变量。
event.clientX 与 event.pageX 有微妙的差别(当整个页面有滚动条的时候),不过大多数时候是等效的。

如果要完全一样,可以稍麻烦些:
mX = event.x ? event.x : event.pageX;
然后用 mX 代替 event.x
(3)其它
event.layerX 在 IE 与 MF 中都有,具体意义有无差别尚未试验。


8. 关于frame
(1)现有问题
在 IE中 可以用window.testFrame取得该frame,mf中不行
(2)解决方法
在frame的使用方面mf和ie的最主要的区别是:
如果在frame标签中书写了以下属性:
<frame src="xx.htm" id="frameId" name="frameName" />
那么ie可以通过id或者name访问这个frame对应的window对象
而mf只可以通过name来访问这个frame对应的window对象

▲返回顶部
Last modified by tommyhu on2010/06/25 16:21

Add a comment

Nickname

emotemotemotemotemotemotemotemotemotemotemotemotemotemotemotemot