本文总结了JavaScript在IE与Firefox浏览器中存在的7个主要差异，涵盖CSS样式访问、元素属性获取、鼠标位置计算及窗口大小检测等场景。通过对比两种浏览器的特定语法（如styleFloat与cssFloat、currentStyle与getComputedStyle），提供了具体的兼容代码示例，帮助开发者解决跨浏览器开发中的常见问题。
本文梳理了JavaScript在IE与Firefox浏览器中存在的七项主要差异。
1. CSS “float” 值
CSS float 值的兼容处理
访问CSS值的基本语法为object.style.property，需将带连字符的属性名转换为驼峰命名法。例如，获取ID为“header”的div元素的background-color值，应使用如下语法：
document.getElementById("header").style.backgroundColor= "#ccc";
由于“float”是JavaScript保留字，无法直接使用object.style.float访问。在两种浏览器中，可采用以下方式处理：
IE浏览器写法：
document.getElementById("header").style.styleFloat = "left";
Firefox浏览器写法：
document.getElementById("header").style.cssFloat = "left";
2. 元素的推算样式
获取元素计算后样式
虽然object.style.property语法便于直接修改行内或JS设定的样式，但无法读取外部样式表定义的“计算后”样式。获取元素计算后样式可使用以下代码：
IE浏览器写法：
var myObject = document.getElementById("header");
var myStyle = myObject.currentStyle.backgroundColor;
Firefox浏览器写法：
var myObject = document.getElementById("header");
var myComputedStyle = document.defaultView.getComputedStyle(myObject, null);
var myStyle = myComputedStyle.backgroundColor;
3. 访问元素的”class”
访问 class 与 label for 属性
与“float”类似，“class”也是JavaScript保留字。在两种浏览器中访问“class”属性的语法如下：
IE浏览器写法：
var myObject = document.getElementById("header");
var myAttribute = myObject.getAttribute("className");
Firefox浏览器写法：
var myObject = document.getElementById("header");
var myAttribute = myObject.getAttribute("class");
上述语法同样适用于使用setAttribute方法设置属性的场景。
4. 访问<label>标签中的”for”
针对第3点提到的情况，访问label标签中的“for”属性时，同样需要区分不同浏览器的语法：
IE浏览器写法：
var myObject = document.getElementById("myLabel");
var myAttribute = myObject.getAttribute("htmlFor");
Firefox浏览器写法：
var = document.getElementById("myLabel");
var myAttribute = myObject.getAttribute("for");
5. 获取鼠标指针的位置
鼠标位置与窗口大小获取
计算鼠标指针位置虽不常见，但在需要时，IE与Firefox的语法存在差异。以下代码展示了最基础的实现，可能是复杂事件处理的一部分，旨在说明两者的异同。需注意，IE的结果与Firefox相比可能存在较大偏差，该方法本身存在缺陷。通常可通过“拖动位置”进行补偿，但这属于另一话题。
IE浏览器写法：
var myCursorPosition = [0, 0];
myCursorPosition[0] = event.clientX;
myCursorPosition[1] = event.clientY;
Firefox浏览器写法：
var myCursorPosition = [0, 0];
myCursorPosition[0] = event.pageX;
myCursorPosition[1] = event.pageY;
6. 获取可见区域、窗口的大小
有时需要获取浏览器可视区域的大小，通常称为“可见区域”。
IE浏览器写法：
var myBrowserSize = [0, 0];
myBrowserSize[0] = document.documentElement.clientWidth;
myBrowserSize[1] = document.documentElement.clientHeight;
Firefox浏览器写法：
var myBrowserSize = [0, 0];
myBrowserSize[0] = window.innerWidth;
myBrowserSize[1] = window.innerHeight;
7. Alpha 透明
Alpha 透明度的跨浏览器实现
这并非JavaScript语法问题，而是源于CSS的Alpha透明属性。当需要实现淡入/出效果时，需通过JavaScript访问CSS的Alpha透明设置，通常在循环中完成。修改JavaScript代码的方法如下：
IE浏览器写法：
#myElement { filter: alpha(opacity=50); }
Firefox浏览器写法：
#myElement { opacity: 0.5; }
IE浏览器写法：
var myObject = document.getElementById("myElement");
myObject.style.filter = "alpha(opacity=80)";
Firefox浏览器写法：
var myObject = document.getElementById("myElement"); myObject.style.opacity = "0.5";
是否还有其他差异？
以上内容由作者（via: 7 JavaScript Differences Between Firefox & IE）根据个人经验整理，sofish在JavaScript领域仍为新手。若存在更多差异，欢迎提出并分享，共同学习！