常见浏览器兼容性问题解决方案

  1. JS类
    1. 统一使用
      1. document.fromName.elements[“elName”]
      2. [ ]来获取集合类对象
      3. el.getAttribute()获取自定义属性
      4. document.getElementById(“id”),不用document.idName
      5. var声明变量(在生产的时候),不用const或let
      6. ” var myX = event.x ? event.x: event.pageX; var myY = event.y? event.y : event.pageY; ” 不直接使用MouseEvent.x或MouseEvent.pageX
      7. ” var targetNode = event.srcElement ? event.srcElement : event.target.target “,不直接使用event.srcElement或event.target
      8. window.location,不使用window.location.href
      9. window.open(URL, name, param)来打开新窗口,不使用window.showModalDialog或window.showModelessDialog
      10. document.body.onload = function(){ … }
      11. el.parentNode,不使用el.parentElement
      12. cursor:hand,不使用cursor:pointer
      13. ” el.style.height = imgEl.height + “px”; “,不使用el.style.height = imgEl.height
    2. 统一不使用
      1. input.type来修改属性
      2. window.event
      3. window.frameId跟window.frameName
  2. HTML类
    1. 通用:使用HTML5 Shiv
  3. CSS类
    1. 通用:使用Normalize.css
    2. opacity
      .demo {
        filter: PRogid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60);
        opacity: 0.6;
      }
  4. 其他类

via 刘涛@知乎 et al.