Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to use Javascript to identify mobile devices

2025-03-28 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/01 Report--

This article focuses on "how to use Javascript to identify mobile devices", interested friends may wish to take a look. The method introduced in this paper is simple, fast and practical. Let's let the editor take you to learn how to identify mobile devices with Javascript.

Javascript to identify different browsers, Windows operating system version identification methods, different platforms Window, Mac, Unix (Linux) methods. Next, the technical staff of Nanchang website Design Company will introduce in detail the methods of using javascript to identify mobile settings.

The corresponding user agent strings are:

Mozilla/5.0 (iPhone;U;CPU like Mac OS Xteren) AppleWebKit/420+ (KHTML, like Gecko)

Version/3.O Mobile/IA543a Saf ari/419.3

Mozilla/5.0 (iPod;U;CPU like Mac OS Xteren) AppleWebKit/420+ (KHTML, like Gecko)

Version/3.0 Mobile/IC28 Saf ari/419.3

Judging from these two strings, it is clear that both iPhone and iPod Touch use Safari (WebKit). Although it is not a real Mac platform, the user agent string contains "CPU like Mac OS x" in order to pass the platform detection. With two strings, it is easy to detect the corresponding device. The first step is to add attributes for all mobile devices to be detected, as follows:

Then, usually by simply detecting the strings "iPhone" and "iPod", you can set the values of the corresponding properties:

System.iphone=ua.indexOf ("iPhone") >-l

System.ipod=ua.indexOf ("iPod") >-1

System.macMobile= (system.iphone | | system.ipod)

Nokia N-series phones also use WebKit, and its user agent string is similar to other WebKit-based phones, such as:

Mozilla/5.O (SymbianOS/9.2; Utility Series 60 NokiaN95/11.0.026; Profile MIDP:2.O

Configuration/CLDC-1.1) AppleWebKit/413 (KHTML, like Gecko) Safari/413

Although Nokia N-Series phones claim to use "Safari" in the user agent string, they are not actually Safari, although they are based on the WebKit engine. As long as you check whether "NokiaN" exists in the user agent string like below, it is enough to determine whether it is a series of mobile phones:

System.nokiaN=ua.indexOf ("NokiaN") >-1

Based on these device information, you can use the following code to determine which device the user is using to access the web page:

If (client.engine.webkit) {

If (client.system.macMobile) {

/ / content of Mac phone

} else if (client.nokiaN) {

/ / the contents of Nokia phones

}}

The last major mobile device platform is Windows Mobile (also known as Windows CE), which is used in Pocket PC and Smartphone. Because technically these platforms belong to the Windows platform, both the Windows platform and the operating system return the correct values. For Windows Mobile 5.0 and earlier, the user agent strings for the two devices are very similar, as follows

As shown:

Mozilla/4.O (compatible; MSIE 4.01; Windows CE; PPC; 240x320)

Mozilla/4.O (compatible; MSIE 4.01; Windows CE; Smartphone; 17 6x220)

The first is from the mobile Intemet Explorer4.01 in Pocket PC, and the second is from the same browser in Smartphone. When the Windows operating system detection script detects these two strings, system.win is set to "CE", so the

You can use this value when Windows Mobile:

System.winMobile= (system.win== "CE")

Technicians from Nanchang Network Company do not recommend testing "PPC" or "Smartphone" in the string because these tokens have been removed in browsers after Windows Mobile 5.0. In general, however, it is sufficient to know that a device is using Windows Mobile.

The complete code is as follows:

Var client = function () {

/ / rendering engines

Var engine = {

Ie: 0

Gecko: 0

Webkit: 0

Khtml: 0

Opera: 0

/ / complete version

Ver: null

}

/ / browsers

Var browser = {

/ / browsers

Ie: 0

Firefox: 0

Safari: 0

Konq: 0

Opera: 0

Chrome: 0

/ / specific version

Ver: null

}

/ / platform/device/OS

Var system = {

Win: false

Mac: false

X11: false

/ / mobile devices

Iphone: false

Ipod: false

Ipad: false

Ios: false

Android: false

NokiaN: false

WinMobile: false

/ / game systems

Wii: false

Ps: false

}

/ / detect rendering engines/browsers

Var ua = navigator.userAgent

If (window.opera) {

Engine.ver = browser.ver = window.opera.version ()

Engine.opera = browser.opera = parseFloat (engine.ver)

} else if (/ AppleWebKit/ (S+) / .test (ua)) {

Engine.ver = RegExp ["$1"]

Engine.webkit = parseFloat (engine.ver)

/ / figure out if it's Chrome or Safari

If (/ Chrome/ (S+) / .test (ua)) {

Browser.ver = RegExp ["$1"]

Browser.chrome = parseFloat (browser.ver)

} else if (/ Version/ (S+) / .test (ua)) {

Browser.ver = RegExp ["$1"]

Browser.safari = parseFloat (browser.ver)

} else {

/ / approximate version

Var safariVersion = 1

If (engine.webkit

< 100){ safariVersion = 1; } else if (engine.webkit < 312){ safariVersion = 1.2; } else if (engine.webkit < 412){ safariVersion = 1.3; } else { safariVersion = 2; } browser.safari = browser.ver = safariVersion; } } else if (/KHTML/(S+)/.test(ua) || /Konqueror/([^;]+)/.test(ua)){ engine.ver = browser.ver = RegExp["$1"]; engine.khtml = browser.konq = parseFloat(engine.ver); } else if (/rv:([^)]+)) Gecko/d{8}/.test(ua)){ engine.ver = RegExp["$1"]; engine.gecko = parseFloat(engine.ver); //determine if it's Firefox if (/Firefox/(S+)/.test(ua)){ browser.ver = RegExp["$1"]; browser.firefox = parseFloat(browser.ver); } } else if (/MSIE ([^;]+)/.test(ua)){ engine.ver = browser.ver = RegExp["$1"]; engine.ie = browser.ie = parseFloat(engine.ver); } //detect browsers browser.ie = engine.ie; browser.opera = engine.opera; //detect platform var p = navigator.platform; system.win = p.indexOf("Win") == 0; system.mac = p.indexOf("Mac") == 0; system.x11 = (p == "X11") || (p.indexOf("Linux") == 0); //detect windows operating systems if (system.win){ if (/Win(?:dows )?([^do]{2})s?(d+.d+)?/.test(ua)){ if (RegExp["$1"] == "NT"){ switch(RegExp["$2"]){ case "5.0": system.win = "2000"; break; case "5.1": system.win = "XP"; break; case "6.0": system.win = "Vista"; break; case "6.1": system.win = "7"; break; default: system.win = "NT"; break; } } else if (RegExp["$1"] == "9x"){ system.win = "ME"; } else { system.win = RegExp["$1"]; } } } //mobile devices system.iphone = ua.indexOf("iPhone") >

-1

System.ipod = ua.indexOf ("iPod") >-1

System.ipad = ua.indexOf ("iPad") >-1

System.nokiaN = ua.indexOf ("NokiaN") >-1

/ / windows mobile

If (system.win = = "CE") {

System.winMobile = system.win

} else if (system.win = = "Ph") {

If (/ Windows Phone OS (dumb.d+) / .test (ua)) {

System.win = "Phone"

System.winMobile = parseFloat (RegExp ["$1"])

}

}

/ / determine iOS version

If (system.mac & & ua.indexOf ("Mobile") >-1) {

If (/ CPU (?: iPhone)? OS (dumped ua) / .test (ua)) {

System.ios = parseFloat (RegExp.$1.replace ("_", ".")

} else {

System.ios = 2; / / can't really detect-so guess

}

}

/ / determine Android version

If (/ Android (dumb.d+) / .test (ua)) {

System.android = parseFloat (RegExp.$1)

}

/ / gaming systems

System.wii = ua.indexOf ("Wii") >-1

System.ps = / playstation/i.test (ua)

/ / return it

Return {

Engine: engine

Browser: browser

System: system

}

} ()

At this point, I believe you have a deeper understanding of "how to use Javascript to identify mobile devices". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report