Home > Web Front-end > JS Tutorial > body text

Foreign experts IE version detection! Now that IE has reached 9, IE detection code_javascript skills

WBOY
Release: 2016-05-16 17:57:31
Original
1196 people have browsed it

In fact, learning Daniu source code is a good progress and can give you a new perspective.
After seeing this article about IE version detection by a great expert, I can only be amazed and amazed. There is so much packed into this short code.
So here I decided to interpret the source code of Daniel, so that IT colleagues who are ready to get closer to Daniel and are still working hard can learn more knowledge from it.

Let’s first take a look at the world’s shortest IE detection code:

Copy the code The code is as follows:

var isIE = !-[1,];

Is it very familiar, but there is a bug and it cannot detect ie9, why? That's because this was done by foreign experts before the release of ie9 by taking advantage of ie's array conversion feature. It has been repaired in IE9, so it is invalid in IE9, but as me at the time, I still sighed and sighed, the experts studied the details and were so in-depth (at that time, I was also obsessed with how to use the shortest code to implement a function and methods, constantly revising and revising, but still...this is the gap, the gap).
I will not interpret and analyze this code for the world's shortest IE detection. After all, there are bugs now and it is not backward compatible. My focus is on the following IE perfect detection, which is theoretically backward compatible, for example Come out IE10, ok, use it, no problem, draw the gap again.

Let’s take a look at the source code first (I will interpret Daniel’s ideas and explain the difficulties in the code later)
Copy the code The code is as follows:

// ---------------------------------- --------------------------
// A short snippet for detecting versions of IE in JavaScript
// without resorting to user-agent sniffing
// ------------------------------------------ ------------------
// If you're not in IE (or IE version is less than 5) then:
// ie === undefined
// If you're in IE (>=5) then you can determine which version:
// ie === 7; // IE7
// Thus, to detect IE:
// if (ie) {}
// And to detect the version:
// ie === 6 // IE6
// ie > 7 // IE8, IE9 .. .
// ie < 9 // Anything less than IE9
// -------------------------- -----------------------------
// UPDATE: Now using Live NodeList idea from @jdalton
var ie = (function(){
var undef,
v = 3,
div = document.createElement('div'),
all = div.getElementsByTagName('i');
while (
div.innerHTML = '',
all[0]
);
return v > 4 ? v : undef;
}());

A very incisive code, but it can be detected perfectly Each version of IE can also be tested by range at once, and you will be taught how to use it in the comments of the source code.
Principle:
Dynamicly create a div, use ie conditional comments to insert an i tag into it, and then detect whether the i tag is added to determine whether it is an ie browser. Continuously loop in the while to compare the version of ie.
Let’s understand this code:
Copy the code The code is as follows:

var undef,
v = 3,
div = document.createElement('div'),
all = div.getElementsByTagName('i');
//This paragraph is easy to understand, declare variables and Create a div and get the i in the div
div.innerHTML = '',
all[0 ]
);

what?while (expression 1, expression 2) What is this? Is it different from the while (expression) we learned?
Tips, if there are multiple expressions in while, the last expression will be used as the judgment for jumping out. The previous expressions, no matter how many there are, will not be used as the judgment for jumping out, but the code inside will be executed.
For example: while (expression is 1, expression is 2, expression 3, expression 4) Only the true or false of expression 4 is used as the escape judgment.
Edit God, it can still be like this, you have gained experience, go and try it quickly, this is the code of Daniel, I can only marvel, marvel!
That’s it. Just a few lines of code, how elegant it is. I hope you can learn the knowledge you want and broaden your horizons.
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template