How to determine client type using JS

This article mainly summarizes and introduces four methods of using JS to determine the client type, such as judging the userAgent of the browser, checking whether it is a mobile terminal (Mobile), ipad, iphone, WeChat, QQ, etc. Friends who need it can refer to it. The following

Preface

When we write responsive layout, we always have to consider whether it is On the mobile side, based on this, here are four methods to determine whether the client is ios or android. Share it for everyone’s reference and study. Let’s take a look at the detailed introduction with the editor.

The method is as follows:

1. The first one: by judging the userAgent of the browser, use Regular rules to determine whether it is an ios and Android client

User Agent is called user agent in Chinese. It is part of the Http protocol and is a component of the header domain. User Agent is also referred to as UA. It is a special string header, an identifier that provides the browser type and version, operating system and version, browser kernel, and other information you are using to the visiting website. Through this logo, the websites visited by users can display different layouts to provide users with a better experience or conduct information statistics; for example, accessing Google on a mobile phone is different from accessing on a computer. These are determined by Google based on the UA of the visitor. of. UA can disguise itself.

The standard format of the browser's UA string: browser identification (operating system identification; encryption level identification; browser language) rendering engine identification version information. But each browser is different.

The code is as follows:

2. The second type: check whether it is mobile, ipad, iphone, WeChat, QQ, etc.

2.1 The code is as follows:

2.2 How to use

/判断是否IE内核
if(browser.versions.trident){ alert("is IE"); }
//判断是否webKit内核
if(browser.versions.webKit){ alert("is webKit"); }
//判断是否移动端
if(browser.versions.mobile||browser.versions.android||browser.versions.ios){ alert("移动端"); }

2.3 Detect browser language

currentLang = navigator.language; //判断除IE外其他浏览器使用语言
if(!currentLang){//判断IE浏览器使用语言
currentLang = navigator.browserLanguage;
}
alert(currentLang);

3. Determine iPhone|iPad|iPod|iOS|Android client

The code is as follows:

if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) { //判断iPhone|iPad|iPod|iOS
 //alert(navigator.userAgent); 
 window.location.href ="iPhone.html";
} else if (/(Android)/i.test(navigator.userAgent)) { //判断Android
 //alert(navigator.userAgent); 
 window.location.href ="Android.html";
} else { //pc
 window.location.href ="pc.html";
};

4. Determine pc or mobile terminal

The code is as follows:

5. Commonly used jump codes

Look at the code

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Related articles:

The problem that beforeRouteLeave cannot be triggered when the browser goes back when using Vue

How to solve the tap "point in the fastclick code "Through"

How to implement animated checkboxes in anime.js

Commonly used components and framework structures in vue (detailed tutorial )

The above is the detailed content of How to determine client type using JS. For more information, please follow other related articles on the PHP Chinese website!