IE浏览器版本判断 & IE文件上传获取文件对象 & window.parent & window.opener

1.IE浏览器版本判断

在check IE浏览器版本之前我们需要知道，各个版本之间的区别，

以下给出各个IE版本之间，关于useragent属性之间的区别：

IE 11：    "Mozilla/5.0 (Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; rv:11.0) like Gecko"
IE 10：    "Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729)"
IE 9：     "Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729)"
IE 8：     "Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729)"
IE 7：     "Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729)"
 

好了，知道了各个版本之间的区别，我们便可以写代码，判断IE版本

function IEVersion() {
     //obtain browser userAgent
    var userAgent = navigator.userAgent;  
    //check IE version that below IE11
    var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1;
    //check IE version for IE11
    var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1;  
    if (isIE) {
        var reIE = new RegExp("MSIE (\\d+\\.\\d+);");
        reIE.test(userAgent);
        var fIEVersion = parseFloat(RegExp["$1"]);
        if (fIEVersion>6) {
            return fIEVersion;//IE Version>=7
        } else {
            return 6;//IE Version<7
        }
    } else if (isIE11) {
        return 11; //IE11  
    } else {
        return -1;//not IE browser
    }
}

 

2.IE文件上传获取文件对象

以前IE是借用浏览器内部组件activeX，获取文件上传对象，实现文件上传的，

而现在最新特性可以使用file对象的files[0]来直接获取文件对象(从IE10开始支持)

<input id='theFile' type="file" name="file" />

使用activeX

if (DetectActiveX()) {
        var fso = new ActiveXObject("Scripting.FileSystemObject");
        var filepath = document.getElementById('theFile').value;
        if (filepath != "") {
            var thefile = fso.getFile(filepath);
            var fileSize = thefile.size;
        }
} 


function DetectActiveX() {
    try {
        var comActiveX = new ActiveXObject("Scripting.FileSystemObject");
    } catch (e) {
        return false;
    }
    return true;
}

 

通过files[0]属性(在activeX组件被用户禁用时有效替代)   //从IE10开始支持  

   var filepath = document.getElementById('theFile').value;
    if (filepath !== "") {
        var fileInput = document.getElementById('theFile');
        var thefile = fileInput.files[0];
        var fileSize = thefile.size;
    }

3.window.parent 和window.opener之间的区别

最近维护一个前端项目时遇到的梗，当时没有太摸清两者之间的却别导致报错

比较差别：

如果A窗口里面通过链接进入到B窗口则   A 窗口时B窗口的parent    在B窗口中可以使用window.parent来调用A窗口中的元素

如果A窗口中通过弹窗（window.open()）打开一个B窗口，则A窗口是B窗口的opener   在B窗口中可以使用window.opener来调用A窗口中的元素