js, css, html determine the various versions of the browser
|
Use regular expressions to determine the IE browser version Determine whether it is IE browser if (document.all) { alert("This is IE browser");} Determine whether it is IE6 browser Method 1: if ( /MSIE 6.0/ig.test(navigator.appVersion) ) {alert("This is IE6 browser");} or /MSIE 8/.test(navigator.appVersion) Method 2: var IE = !+'\v1'; IE6 = IE && ([/MSIE(\d)\.0/i.exec(navigator.userAgent)][0][1] == 6) Determine whether it is IE7 browser if ( /MSIE 7.0/ig.test(navigator.appVersion) ) {alert("This is IE7 browser");} Judge the IE browser based on the above, and judge other IE browsers by the same logic. Identify each browser by browser version information var _uat=navigator.userAgent; if(_uat.indexOf("MSIE 6.0")>0) alert("ie6"); else if(_uat.indexOf("MSIE 7.0")>0) alert("ie7"); else if(_uat.indexOf("MSIE 8.0")>0) alert("ie8"); else if(_uat.indexOf("Firefox")>0) alert("firefox"); CSS determines the browser #example{color:red ;} /*firefox*/ * html #example{color:blue;} /*ie6*/ *+html #example{color:green;} /*ie7*/ HTML determines the browser 1. <!--[if !IE]><!-->Available except IE<!--<![endif]--> 2. <!--[if IE]> All IE can recognize<![endif]--> 3. <!--[if IE 6]> Only IE6 can recognize<![endif]--> 4.<!--[if lt IE 6]> IE6 and below versions can recognize<![endif]--> 5. <!--[if gte IE 6]> IE6 and above versions can recognize<![endif]--> 6.<!--[if IE 7]> Only IE7 can recognize<![endif]--> 7. <!--[if lt IE 7]> IE7 and below versions can recognize<![endif]--> 8. <!--[if gte IE 7]> IE7 and above versions can recognize<![endif]--> Version numbers in css and js links in HTML background Search the keyword .htaccess cache in the search engine, and you can find many tutorials on setting up website file cache. By setting up, you can cache CSS, JS and other files that are not updated frequently on the browser side, so that every time a visitor visits your website, the browser can get CSS, JS, etc. from the browser cache instead of reading from your server. This speeds up the opening of the website to a certain extent and saves your server traffic. question Now the problem comes. The css and js caches set by .htaccess have an expiration time. If css and js have been cached in the visitor's browser, the browser will only read css and js from the cache before these css and js caches expire. If you modify css and js on the server, then these changes will not change in the browser of returning customers, unless the returning customer presses Ctrl + F5 to refresh your website page or manually clears the browser cache. A website has tens of thousands of visitors, many of whom are repeat visitors. You can’t ask every visitor to refresh the cache after updating the CSS. So how would you deal with this problem? Solution 1. Change the css file name: In fact, it is very simple to solve this problem. The cache is marked by the file name. After you update the CSS file content of the website, just change the CSS file name. For example, the css call statement in the original html is as follows: <link rel="stylesheet" href="http://www.example.com/style.css" type="text/css" media="screen" /> Just change the css file name: <link rel="stylesheet" href="http://www.example.com/index.css" type="text/css" media="screen" /> Another way to change the css file name is to write the version number into the file name, such as: <link rel="stylesheet" href="http://www.example.com/index.v2011.css" type="text/css" media="screen"/> After the css file is updated, just change the version number in the file name: <link rel="stylesheet" href="http://www.example.com/index.v2012.css" type="text/css" media="screen"/> 2. Add a version number to the CSS file: In fact, it is a bit troublesome to modify the CSS file name every time the CSS file is modified. Then we can add a version number in the loading CSS statement (that is, the content after ? in the CSS link). For example, the css call statement in the original html is as follows: <link rel="stylesheet" href="http://www.example.com/style.css?v=2011" type="text/css" media="screen"/> Just change the version number of the css file to 2012: <link rel="stylesheet" href="http://www.example.com/style.css?v=2012" type="text/css" media="screen"/> Summarize In fact, the question mark after the css file has no practical effect and can only be used as a suffix. If you use the question mark plus parameter method, you can add version number and other information, and refresh the browser cache at the same time. A small detail can bring us great convenience. |
<<: HTML version declaration DOCTYPE tag
>>: Detailed explanation of JavaScript function this pointing problem
Recommend
Common methods and problems of Docker cleaning
If you use docker for large-scale development but...
Vue interpretation of responsive principle source code analysis
Table of contents initialization initState() init...
Detailed explanation of Linux one-line command to process batch files
Preface The best method may not be the one you ca...
Getting Started: A brief introduction to HTML's basic tags and attributes
HTML is made up of tags and attributes, which are...
MySQL 5.0.96 for Windows x86 32-bit green simplified version installation tutorial
MySQL 5.0 has become a classic because of its few...
Use PSSH to batch manage Linux servers
pssh is an open source software implemented in Py...
SQL Practice Exercise: Online Mall Database User Information Data Operation
Online shopping mall database-user information da...
Detailed introduction to Mysql date query
Query the current date SELECT CURRENT_DATE(); SEL...
A debugging process record of Chinese garbled characters in the Tomcat source code startup console
Find the problem Today I am going to study the to...
Detailed explanation of data types and schema optimization in MySQL
I'm currently learning about MySQL optimizati...
What are the new CSS :where and :is pseudo-class functions?
What are :is and :where? :is() and :where() are p...
Solution to the problem that directly setting the width and height of a hyperlink does not work
It is not possible to use width and height directl...
Best tools for taking screenshots and editing them in Linux
When I switched my primary operating system from ...
Let's talk about the performance of MySQL's COUNT(*)
Preface Basically, programmers in the workplace u...
MySQL 5.7.21 winx64 green version installation and configuration method graphic tutorial
This article records the installation and configu...