我和IE有个约会

2018-03-28  本文已影响8人  WantACocktail

如题:主要是更新一些关于IE兼容性的问题

1.动态引入JS时onload的兼容

实际开发过程中经常遇到需要动态的去加载某个js,然后再执行一系列的操作,这里便涉及到如果我们需要操作dom的方法或者数据包含在该js文件中,那么我们就需要在js文件onload后再进行dom的操作。

动态引入js的方法(原生):

 var oHead = document.getElementsByTagName('head')[0];

 var oScript = document.createElement("script");

 oScript.setAttribute("type", "text/javascript");

 oScript.setAttribute("src", "https://news.xunyou.com/service/lite.js?id=" + Math.random());

 oScript.setAttribute("id", "myjs");

 oHead.appendChild(oScript);

onload:

 //Chrome,Firefox(onload方法在IE中不会被执行)
 oScript.onload = oScript.onerror = function(t) {
    if (t.type == "load") {
           //do something
    }
 }

onreadystatechange:

 //IE
 oScript.onreadystatechange = function() {
    var r = oScript.readyState;
    if (r === 'loaded' || r === 'complete') {
           //do something
    }
 }

2.z-index在IE7下的遮挡问题

IE7下面并列的父级的z-index决定了父级下面子集的z-index,若父级1的z-index为1,父级2的z-index为2.则父级1的子集的z-index再高也会被父级2所遮挡。

解决办法:很简单,避免多个并列父级,将要置顶显示的元素公用一个父级。

The Relentless Pursuit of Perfection 持续更新中

上一篇 下一篇

猜你喜欢

热点阅读