Firefox与IE浏览器JavaScript兼容写法指南

Firefox与IE浏览器JavaScript兼容写法指南

在Web开发中，Firefox与IE浏览器在JavaScript实现上存在显著差异，以下是几种常见场景的兼容处理方案： 1. 获取浏览器事件对象：为了同时兼容IE和Firefox，可以定义一个getEvent函数。该函数首先检查document.all属性以判断是否为IE，若是则返回window.event；否则通过调用者链查找arguments[0]，并验证其是否为Event或MouseEvent对象且具备preventDefault和stopPropagation方法，若符合则返回该对象，否则返回null。在Firefox中，每次使用事件前需调用此函数，否则事件对象可能为空。 2. 屏蔽Form提交事件：在IE中，可通过设置event.returnValue为false来阻止默认行为；而在Firefox中，则需调用evt.preventDefault()方法。 3. 获取事件源：IE浏览器使用event.srcElement属性来获取触发事件的元素，而Firefox则使用event.target属性。 4. 添加事件监听器：定义一个addEvent函数，若元素支持attachEvent（IE），则调用attachEvent方法；否则，从事件名称中去除前缀“on”，并调用addEventListener方法添加监听器，第三个参数设为false。使用示例为addEvent(window, "onload", Start)。 5. 模拟Firefox的innerText属性：由于Firefox原生不支持innerText，可通过__defineGetter__和__defineSetter__方法为HTMLElement原型定义该属性。获取时，遍历子节点，若节点类型为元素且标签为BR则添加换行符，否则递归获取innerText；若节点类型为文本节点，则直接获取nodeValue。设置时，直接将textContent赋值为传入的字符串。 6. 样式长度单位：在Firefox中，设置元素长度时必须显式添加“px”单位，而IE对此没有严格要求。 7. 获取父控件下的子控件：IE使用children属性获取直接子元素，而Firefox则使用childNodes属性获取所有子节点（包括文本节点）。 8. XmlHttp发送数据：在IE中，XmlHttp对象的send方法可以接受空参数；但在Firefox中，若发送空字符串可能导致411错误，因此应显式传递一个空格字符串send(" ")作为参数。