我和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所遮挡。
解决办法:很简单,避免多个并列父级,将要置顶显示的元素公用一个父级。