Different JS files are loaded on the mobile and PC side respectively

Source: Internet
Author: User

In fact, there are many ways of mobile phone and PC, we often encounter such demand in the construction of responsive design and responsive website. Let's talk about the requirements we encountered in the project:

Different JS customer service codes are loaded on the mobile and PC side (note: The different JS files are loaded separately on the PC and the mobile phone)

First method (Simple Type):

  1. <script type="Text/javascript" >
  2. Depending on the screen size
  3. if (screen && screen.width > 480) {
  4. document.write (' <script type= ' Text/javascript "charset=" Utf-8 "src="123.js "><\/script>");
  5. }
  6. UserAgent judgment
  7. if (/android|webos|iphone|ipod|ipad| Blackberry/i.test (navigator.useragent)) {
  8. document.write (' <script type= ' Text/javascript "charset=" Utf-8 "src="123.js "><\/script>");
  9. }
  10. </script>

The second method (has been tested, the project is actually in use):

  1. <script type="Text/javascript" >
  2. function Browserredirect () {
  3. var suseragent = Navigator.userAgent.toLowerCase ();
  4. var bisipad = Suseragent.match (/ipad/i) = = "ipad";
  5. var Bisiphoneos = Suseragent.match (/iphone os/i) = = "iphone OS";
  6. var BISMIDP = Suseragent.match (/midp/i) = = "MIDP";
  7. var bIsUc7 = Suseragent.match (/rv:1.2.3.4/i) = = "rv:1.2.3.4";
  8. var bisuc = Suseragent.match (/ucweb/i) = = "UCWeb";
  9. var bisandroid = Suseragent.match (/android/i) = = "Android";
  10. var bisce = Suseragent.match (/windows ce/i) = = "Windows CE";
  11. var biswm = Suseragent.match (/windows mobile/i) = = "Windows Mobile";
  12. Document.writeln ("Your browsing device is:");
  13. if (Bisipad | | bisiphoneos | | bismidp | | bIsUc7 | | bisuc | | bisandroid | | bisce | | biswm) {
  14. Alert ("Mobile browsing! ");
  15. document.write (' <script type= ' Text/javascript "charset=" Utf-8 "src="123.js "><\/script>");
  16. } Else {
  17. Alert ("PC browsing! ");
  18. document.write (' <script type= ' Text/javascript "charset=" Utf-8 "src="123.js "><\/script>");
  19. }
  20. }
  21. Browserredirect ();
  22. </script>

This way we directly in the PC side and the phone end of the output of different JS. Therefore, we in the mobile phone and the PC side load different JS needs to solve the perfect.

Different JS files are loaded on the mobile and PC side respectively

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.