javascript firefox兼容ie的dom方法脚本

要让javascript的DOM方法在Firefox和IE两种浏览器下兼容，需要注意以下几点：

1. 使用标准的DOM API方法，避免使用浏览器特有的方法。

例如，不要使用IE特有的 document.all 方法，应该使用document.getElementById() 或 document.getElementsByTagName()方法来获取HTML元素。

1. 避免使用全局变量

在IE中，全局变量属于 window 对象的属性，但在Firefox中，全局变量不是 window 对象的属性。因此，在javascript脚本中，应该用一个局部变量来保持对 window 对象的引用，例如：var win = window;

1. 避免使用 IE 的事件模型

在 IE 浏览器中，事件模型是基于 COM/OLE 技术的，与 W3C 标准中定义的事件模型有所不同。因此，在Firefox中使用 IE 的事件模型是不可取的。

示例1：

以下代码演示了如何使用 W3C 标准的 DOM API 方法在 Firefox 和 IE 中设置元素的样式：

function setElementStyle(element, styleName, styleValue) {
  if (element.style && (typeof element.style[styleName] != "undefined")) {
    element.style[styleName] = styleValue;
  } else if (element.setAttribute) {
    element.setAttribute(styleName, styleValue);
  } else {
    element.style = element.style || {};
    element.style[styleName] = styleValue;
  }
}

// 调用示例：
var myElement = document.getElementById('myElement');
setElementStyle(myElement, 'color', 'red');
setElementStyle(myElement, 'background-color', 'yellow');

此方法首先检查元素是否支持 HTMLElement.style 对象，如果是，直接设置样式。如果不支持，则检查是否支持 setAttribute 方法。如果支持，则使用 setAttribute 方法来设置样式。如果仍然不支持，则设置元素的 style 对象。

示例2：

以下代码演示了如何使用 DOM API 在 Firefox 和 IE 中添加和删除元素的class属性：

function hasClass(element, className) {
  if (!element || !element.className) {
    return false;
  }
  //使用正则表达式匹配类名，忽略前后空格
  var pattern = new RegExp('(^|\\s)' + className + '(\\s|$)');
  //返回是否匹配成功
  return pattern.test(element.className);
}

function addClass(element, className) {
  if (!hasClass(element, className)) {
    //空格连接新的class名
    element.className += (element.className ? ' ' : '') + className;
  }
}

function removeClass(element, className) {
  if (hasClass(element, className)) {
    var pattern = new RegExp('(^|\\s)' + className + '(\\s|$)');
    element.className = element.className.replace(pattern, '$1').replace(/\s+/g, ' ').replace(/(^ | $)/g, '');
  }
}

// 调用示例：
var myElement = document.getElementById('myElement');
addClass(myElement, 'new-class');
removeClass(myElement, 'old-class');

此方法首先检查元素是否存在class属性，如果不存在则返回 false，如果有则使用正则表达式匹配类名，忽略前后空格，查看是否已经添加或删除此类。如果没有，则将新类名与现有类名以一个空格连接起来添加到元素的class属性中。如果已经存在，则使用正则表达式将该类名从 class 属性中删除。