兼容IE和FF的js脚本代码小结（比较常用）

下面我就为你详细讲解“兼容IE和FF的js脚本代码小结”。

核心思路

为了实现JS的兼容性，我们需要了解两个概念：DOM和事件模型。DOM是文档对象模型，即浏览器把HTML和XML文档解析成树形结构，并提供了一组API，使得开发人员可以轻易地操作文档中的元素。而事件模型则是指浏览器处理事件（比如用户点击某个元素，或者页面加载完成等）的方式。

根据这两个概念，我们可以采取以下的兼容性策略：

1. 针对DOM的兼容性，可以采用封装好的函数来解决不同浏览器之间的差异；
2. 针对事件模型的兼容性，则可以使用addEventListener和attachEvent这两个方法来进行兼容性处理。

DOM兼容性

下面是一些示例代码，用于演示如何实现针对DOM的兼容性：

获取元素文本

function getElementText(element) {
  if (typeof element.innerText !== 'undefined') {
    return element.innerText;
  } else {
    return element.textContent;
  }
}

这里我们使用了判断innerText属性是否存在来判断浏览器是否支持此属性，从而决定采用哪种方法来获取文本内容。

获取当前窗口的滚动位置

function getScrollPosition() {
  var doc = document.documentElement;
  var left = (window.pageXOffset || doc.scrollLeft) - (doc.clientLeft || 0);
  var top = (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0);
  return { left: left, top: top };
}

这里我们使用了window.pageXOffset和window.pageYOffset这两个属性来获取滚动位置。如果浏览器不支持这两个属性，则使用document.documentElement.scrollLeft和document.documentElement.scrollTop这两个属性来获取滚动位置。

事件模型兼容性

下面是一些示例代码，用于演示如何实现针对事件模型的兼容性：

添加事件监听器

function addEventListener(element, eventType, handler) {
  if (element.addEventListener) {
    element.addEventListener(eventType, handler);
  } else {
    element.attachEvent('on' + eventType, handler);
  }
}

这里我们使用了element.addEventListener和element.attachEvent这两个方法来添加事件监听器。如果浏览器支持addEventListener方法，则使用此方法来添加事件监听器；否则，则使用attachEvent方法来添加事件监听器。

移除事件监听器

function removeEventListener(element, eventType, handler) {
  if (element.removeEventListener) {
    element.removeEventListener(eventType, handler);
  } else {
    element.detachEvent('on' + eventType, handler);
  }
}

这里我们使用了element.removeEventListener和element.detachEvent这两个方法来移除事件监听器。如果浏览器支持removeEventListener方法，则使用此方法来移除事件监听器；否则，则使用detachEvent方法来移除事件监听器。

总结

通过以上的一些示例代码，我们可以实现在不同浏览器之间实现JS代码的兼容性。但需要注意的是，这种兼容性的方法并不一定能够覆盖到所有的浏览器，因此在实际开发中，还需要根据实际情况来进行代码的兼容性处理。