JS Magic Hall: Accurate judgment of IE's document mode by feature sniffing

Source: Internet
Author: User

First, preface

Bitter front-end siege lions are greatly affected by browser compatibility, and then complete each function before you have to look around, for fear that the browser does not support an API, for fear that the native API contains a bug so that the browser type and version number as a non-circumvention of a level, and feature sniffing is another tool after the browser to deal with the above problem.

Second, what is characteristic sniffing

We used to differentiate between browser type and get version number by navigator.useragent or Navigator.appname two attribute values for specific string matching and extraction. But as IE8 provides optional document compatibility mode settings and the appearance of various Packers browsers, The behavior of feature sniffing is caused by the fact that the property values of navigator.useragent and navigator.appname cannot accurately determine the API features and document patterns that the browser actually provides. In fact, feature sniffing is solving two kinds of problems, first, whether or not to support certain characteristics; second, what is the current document mode (note that the document mode, not the browser version number).

And the famous var isLteIE8 =!+[1,]; is to determine whether the feature sniffer is in the IE5678 document mode.

Third, determine the current document mode IE                            

// determine if it is IE var isie = Navtigator.userAgent.toLocaleLowerCase (). IndexOf ('msie')!==- 1 ;
Determine if Ie5678var isLteIE8 = Isie &&!+[1,];
Prevents version invalidation by preventing document mode from being set in document compatibility mode through ie8+
var dm = Document.documentmode,
IsIE5, IsIE6, IsIE7, IsIE8, IsIE9, isIE10, isIE11;
if (DM) {
isIE5 = DM = = = 5;
IsIE6 = DM = = = 6;
IsIE7 = DM = = = 7;
IsIE8 = DM = = = 8;
isIE9 = DM = = = 9;
isIE10 = DM = = = 10;
isIE11 = DM = = = 11;
}
else{
//determine if the text pattern for ie5,ie5 is in the weird mode (quirks)IsIE5 = (isLteIE8 && Document.compatmode = = ='Backcompat'); //determines whether a XMLHttpRequest object is started for Ie6,ie7isIE6 = isLteIE8 &&!isie5 &&!XMLHttpRequest; //determine if IE7,IE8 starts with Document.documentmode propertyisIE7 = isLteIE8 &&!isie6 &&!Document.documentmode; //Judging whether IE8IsIE8 = IsLteIE8 &&Document.documentmode; //Judge Ie9,ie10 start to support strict mode, in strict mode function inside this is undefinedisIE9 =!islteie8 &&(function () {"Use Strict"; return!! This;  }()); //Judging Ie10,ie11 starts removing the Attachevent propertyISIE10 = Isie &&!! Document.attachevent &&(function () {"Use Strict"; return! This;   }()); //Judging IE11isIE11 = Isie &&!document.attachevent;
}

Note: If you set the document mode to IE6 by ie8+ by specifying the document compatibility mode, the above var isIE6 = isLteIE8 &&!isie5 &&! XMLHttpRequest will judge the error, because XMLHttpRequest is present, because the document compatibility mode is only as far as possible to emulate the old version of the browser, not exactly the same as the old version of the browser. Therefore, the current document mode can be judged directly by Document.documentmode.

Iv. Summary

Because this article in the code implementation, combined with the "JS Magic Hall: Browser mode and text mode How to play?" "may be easier to understand in this article.

Respect the original, reprint please indicate from: http://www.cnblogs.com/fsjohnhuang/p/3818947.html, ^_^ Fat Boy John

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.