The decision of browser version in js,jsp--front-end development process

Source: Internet
Author: User
Tags first row

the decision of browser and its version in js,jsp--front-end development process

On the Internet to find a browser and version of the method there are many, the younger brother summed up one or two to save everyone time.

Method of 1.jquery:

Regular expressions are used to determine common browsers and their versions.

function Allinfo () {var ua = navigator.useragent;   
    UA = Ua.tolowercase (); var match =/(WebKit) [\/] ([\w.]   
    +)/.exec (UA) | | /(opera) (?:. *version)? [ \/] ([\w.]   
    +)/.exec (UA) | | /(MSIE) ([\w.]   
    +)/.exec (UA) | | !/compatible/.test (UA) &&/(Mozilla) (?:. *? RV: ([\w.] +))?/.exec (UA) | |   

   []; If you need to get the browser version number: match[2] switch (match[1]) {case "MSIE"://ie if parseint (ma  
            TCH[2] = = 6) {//ie6 alert ("IE6"); Alert ("Temporarily does not support IE7.0 and the following version of browsers, please upgrade your browser version.")
               ");
              document.getElementById ("hid"). Style.display = "None";
          document.getElementById ("Show"). Style.display = "block";
          document.getElementById ("Nosee_b"). Style.display = "None";
               else if (parseint (match[2]) = = 7) {//IE7 alert ("IE7");    
              document.getElementById ("hid"). Style.display = "None"; Document.getelemEntbyid ("Show"). Style.display = "block";  
       else if (parseint (match[2]) = = 8) {//IE8 alert ("IE8"); 
          else if (parseint (match[2]) = = 9) {alert ("IE9");    
       document.getElementById ("hid"). Style.display = "None";           
     } break;
     Case "WebKit"://safari or Chrome//alert ("Safari or Chrome");                 
      document.getElementById ("Middle"). Style.display = "None";           
     Break               
      Case "Opera"://opera Alert ("opera");               
     Break 
      Case "Mozilla"://firefox alert ("Firefox");              
      document.getElementById ("hid"). Style.display = "None";           
     Break               
    Default:break;   }   
}

"= =" is used here to understand its relationship with "= =" and "=".

= This is not much to say, development is to assign values to the parameters.

= = Equality equivalent, = = identity identity.
= =, when both sides of the value types are different, you have to do type conversion, and then compare.
= = =, do not do type conversion, different types must vary.

For Example:
If two value types are different, they may be equal. Type conversions and comparisons are made according to the following rules:
A, if one is null, one is undefined, then [equals].
B, if one is a string, and one is a numeric value, the string is converted to a numeric value and then compared.
C, if either value is true, convert it to 1 and compare it to 0 if any value is false.
D, if one is an object, and the other is a numeric value or a string, the object is converted to the underlying type for a comparison. object to the underlying type, using its ToString or ValueOf method. JS core built-in class, will try to valueof before ToString, the exception is date,date use of ToString conversion.

The annotation method in 2.HTML

The annotation method in

(1) HTML can use the following code to detect the version of the current IE browser ( Note: does not see effects in non-IE browsers), this method is used for IE5 and above versions. The annotation format for HTML is <!--Comment content -->, IE makes some extensions to the HTML annotation to support conditional judgment expressions: <!--[if expression]> HTML <! [endif]-->   Displays HTML content when the expression expression is true. [If ie]   to judge whether IE [if!] ie]  to determine if it is not ie [if LT ie 5.5]  to determine if it is IE5.5 the following version.   (<) [If LTE IE 6]   determine whether equals IE6 version or below (<=) [if GT IE 5]  to determine if IE5 above version   (>) [If GTE IE 7 ]  determine if IE7 version or above [if! ( IE 7)] to determine if it is not IE7 [if (GT IE 5) & (LT IE 7)]   to determine whether it is greater than IE5, less than IE7 [if (ie 6) | ( IE 7]  to determine whether IE6 or IE7
  LTE: is the shorthand for less than or equal to, which means less than or equal to.   LT: is the shorthand for less than, meaning less than. &NBSP GTE: is the shorthand for greater than or equal to, meaning greater than or equal to. &NBSP GT: is the shorthand for greater than, which means greater than. &NBSP !:   is not equal to meaning, same as not equal to the same in JavaScript
Example:

<!--[if ie]><p>you are using Internet explorer.</p><! [endif]-->  
<!--[if IE 7]><p>welcome to Internet Explorer 7!</p><![ Endif]-->  
<!--[if! ( IE 7)]><p>you are not using version 7.</p><! [endif]-->  
<!--[if GTE ie 7]><p>you are using IE 7 or greater.</p><![ Endif]-->  
<!--[if (ie 5)]><p>you are using IE 5 (any version). </p><![ Endif]-->  
<!--[if (GTE IE 5.5) & (LT IE 7)]><p>you are using IE 5.5 or IE-6.</p><![ Endif]-->  
<!--[if LT IE 5.5]><p>please upgrade your version of Internet explorer.</p><![ Endif]-->  

(2) How the conditional annotation should be applied

Because IE each version of the browser to our web Standard page interpretation is not the same, specifically the interpretation of the CSS is different, we in order to compatible with these, we can use conditional annotation to define their own, and ultimately achieve compatibility purposes.

For example: <!–-call CSS.CSS style sheet by default –->

<link rel= "stylesheet" type= "Text/css" href= "Css.css"/><!-–[if IE 7]>

<!–-if the IE browser version is 7, call IE7.CSS style sheet-–>

<link rel= "stylesheet" type= "Text/css" href= "Ie7.css"/><! [endif]–->

<!–-[if LTE IE 6]>

<!–-if the IE browser version is less than or equal to 6, call IE.CSS style sheet-–>

<link rel= "stylesheet" type= "Text/css" href= "Ie.css"/><! [endif]–> this distinguishes the IE7 and IE6 down browsers from the implementation of CSS, to achieve compatibility. At the same time, the default css.css of the first line can also be compatible with other non IE browsers.

Note: The default CSS style should be in the first row of the HTML document, and all content judged by the conditional annotation must be in the default style. For example, the following code, in IE browser execution is displayed in red, and in non-IE browser display as black. If you put a conditional comment on the first line, you cannot implement it. This example can explain the Web page to the Internet Explorer and non-IE browser compatibility problem resolution. <style type= "Text/css" > body{background-color: #000;} </style> <!-–[if ie]>

<style type= "Text/css" >body{background-color: #F00;} </style><! [endif]–->

At the same time, someone will try to use <!–-[if! Ie]> to define the situation in non-ie browsers, but note that conditional annotations can only be performed under IE, which is not a single definition of the condition under IE, but a blind eye to annotations.

Normal is the default style, for IE browser needs special treatment, only to make conditional comments. In an HTML file, but not in a CSS file.

The DWCS4 is now equipped with these notes: In the window--> code fragment--> comment. The other versions didn't notice much.

This article refers to: JSP to determine the browser version of the statement, for a browser compatible, JS judge run JSP page browser type and version

Related Article

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.