适配IE9~11我遇到的那些坑

哎，折磨鸭……

PS：我会把判断IE9和IE浏览器的函数丢末尾，这个基本也是网上一找一堆。

1.IE下删除当前节点的   remove()   方法无法使用

IE无法直接   dom.remove()   删除当前dom节点

只能通过   dom.removeNode(true)  去删除

2.IE下style赋值

无法通过   dom.style = `一堆css`  去赋值

只能通过   dom.style.width = '10px'  之类的去赋值

3.IE下遍历dom元素数组

我是通过   let a = dom.getElementsByClassName()   查找的dom数组

a.item(0)   可以直接查到元素

Chrome下：

 IE11下：

IE9下：

---by 20210806   适配ie折磨呀┭┮﹏┭┮

4.IE下【1px】适配后显示问题

项目里做了适配嘛，1px会被除以192，之后就是IE显示问题了

1px---适配后---0.00521rem---不会被显示，应该是小数点后两位都是0直接被浏览器认为是0了

2px---适配后---0.01rem---会显示

嗯，IE看来只会获取到小数点后两位，Chrome是可以获取到后三位的

5.IE9下文件上传问题

主要问题为IE9下input框内的file文件对象无法获取的问题

具体解决方法看我另一篇文章：CSDN

6.IE9下flex布局无法使用

项目写一半，适配了下IE才发现，IE9不能用flex！woc！

所幸还是被我找到了适配的办法，不过建议判断一下是否IE9再引入，毕竟这个对样式改动挺大的，而且全是内联_(:з」∠)_

github地址：GitHub - robertpanvip/flex-native: A JavaScript polyfill for Flexbox、 ie9 flexbox polyfill 适合在ie9中使用flexbox

---by 20210907   项目完了，IE的bug还一堆，愁愁愁~

判断是否为IE9 或 IE的方法

function isIE9(){
    var userAgent = navigator.userAgent;   // 获取浏览器信息
    var IEReg = new RegExp("MSIE \\d+\\.\\d+;");   // 正则校验IE标识符
    var IEMsg = IEReg.exec(userAgent);   // 获取字符串
    var IEVersionNum = new RegExp("\\d+\\.\\d");   // 正则获取版本

    // 是IE9，引入js文件
    if (IEMsg && parseFloat(IEVersionNum.exec(IEMsg)) == 9) {
        console.log('是IE9')
        return true
    } else {
        console.log('不是IE9')
        return false
    }
}

function isIE(){
    // 是否为IE系列---IE11没带MSIE标识符，所以用下面这个方法判断
    if (!!window.ActiveXObject || "ActiveXObject" in window) {
        console.log('是IE')
        return true
    } else {
        console.log('不是IE')
        return false
    }
}

export const allFn = {
    isIE9,
    isIE,
}