`

Javascript 浏览器设备识别

阅读更多

 

<!DOCTYPE html>
<html lang="en">
<head>
        <meta charset="utf-8" />
        <title>Screen Width Test</title>
<style type="text/css">
@media all and (max-device-width: 1024px) {
        body {
        background-color: yellow;
        }
}

</style>

</head>
<body>
<script type="text/javascript">
var agent = navigator.userAgent.toLowerCase();
var scrWidth = screen.width;
var scrHeight = screen.height;
// The document.documentElement dimensions seem to be identical to
// the screen dimensions on all the mobile browsers I've tested so far
var elemWidth = document.documentElement.clientWidth;
var elemHeight = document.documentElement.clientHeight;
// We need to eliminate Symbian, Series 60, Windows Mobile and Blackberry
// browsers for this quick and dirty check. This can be done with the user agent.
var otherBrowser = (agent.indexOf("series60") != -1) || (agent.indexOf("symbian") != -1) || (agent.indexOf("windows ce") != -1) || (agent.indexOf("blackberry") != -1);
// If the screen orientation is defined we are in a modern mobile OS
var mobileOS = typeof orientation != 'undefined' ? true : false;
// If touch events are defined we are in a modern touch screen OS
var touchOS = ('ontouchstart' in document.documentElement) ? true : false;
// iPhone and iPad can be reliably identified with the navigator.platform
// string, which is currently only available on these devices.
var iOS = (navigator.platform.indexOf("iPhone") != -1) ||
        (navigator.platform.indexOf("iPad") != -1) ? true : false;
// If the user agent string contains "android" then it's Android. If it
// doesn't but it's not another browser, not an iOS device and we're in
// a mobile and touch OS then we can be 99% certain that it's Android.
var android = (agent.indexOf("android") != -1) || (!iOS && !otherBrowser && touchOS && mobileOS) ? true : false;

document.write("<p><b>Screen width:</b> " + scrWidth +"px<br />" +
                                "<b>Screen height:</b> " + scrHeight + "px<br />" +
                                "<b>Document element width:</b> " + elemWidth +"px<br />" +
                                "<b>Document element height:</b> " + elemHeight + "px<br />" +
                                "<b>iOS device:</b> "+iOS+"<br />"+
                                "<b>Mobile OS:</b> "+mobileOS+"<br />"+
                                "<b>Touch OS:</b> "+touchOS+"<br />"+
                                "<b>Android device:</b> "+android+"</p>" +
                                "<p><b>User agent string:</b> "+navigator.userAgent+"</p>"
                                );
</script>
</body>
</html>
分享到:
评论

相关推荐

    js设备识别

    js设备识别,智能机浏览器版本信息

    10JavaScript浏览器对象模型BOM.docx

    JavaScript浏览器对象模型(BOM,Browser Object Model)是JavaScript在Web开发中用于操作浏览器特性的核心部分。它不依赖于HTML文档对象模型(DOM),而是提供了与浏览器交互的一系列对象,如Window、Navigator、...

    2.5代指纹追踪技术—跨浏览器指纹识别.pdf

    在如今,做安全防御已经不仅仅是被动的等着攻击者攻击,作为防御⽅,有越来越多的⽅法去反击攻击者,甚⾄给攻击者⼀些威胁...设备指纹技术是⼀种⻓久有效的追踪技术,即使攻击者挂再多 vpn,也能够准确识别攻击者身份。

    javascript浏览器及系统判断

    ### JavaScript浏览器及系统判断知识点详解 #### 一、概述 在Web开发中,了解用户的浏览器类型及操作系统对于兼容性处理尤为重要。本篇文章将基于提供的JavaScript代码片段,详细解析如何通过JavaScript来判断用户...

    浏览器的JavaScript引擎的识别方法

    浏览器的JavaScript引擎识别方法涉及的技术点包括JavaScript引擎的介绍、如何在JavaScript中检测浏览器的JavaScript引擎以及如何通过特定的属性和方法来确定不同的JavaScript引擎。 首先,JavaScript引擎是浏览器...

    fingerprintjs2现代灵活的浏览器指纹识别库

    fingerprintjs2库通过收集和组合多种浏览器和设备特性,创建了一个独特的“指纹”,这个指纹可以用来识别特定的浏览器实例。 首先,我们需要理解浏览器指纹的基础概念。浏览器指纹是通过收集用户的浏览器设置、插件...

    识别二维码支持所有浏览器,多研究.zip

    在本文中,我们将深入探讨如何实现一个跨浏览器的二维码识别功能,主要基于JavaScript(JS)进行开发,并关注HTML的相关应用。 首先,我们需要理解二维码的基本原理。二维码是一种二维条形码,由黑白相间的模块组成...

    javascript解决浏览器兼容性问题

    本文将详细介绍如何使用JavaScript解决浏览器兼容性问题,特别是针对XMLHttpRequest对象的创建及对不同版本IE浏览器的识别。 #### 二、XMLHttpRequest对象的兼容性创建 XMLHttpRequest对象是用于执行异步请求的...

    浅析如何利用JavaScript进行语音识别

    所谓语音识别就是将你所说的转化成文字。Chrome 浏览器在版本25之后开始对这一特性的支持。这篇文章将会详细的介绍如何使用JavaScript进行语音识别,感兴趣的朋友们可以参考借鉴,下面来一起看看吧。

    JavaScript判断各种浏览器代码

    在本篇文章中,我们将深入探讨如何使用JavaScript来识别不同的浏览器,并根据这些信息执行特定操作。这一技术对于确保网站与各种浏览器兼容以及优化用户体验至关重要。通过分析提供的代码片段,我们可以了解到几种...

    JavaScript判断浏览器类型及版本

    ### JavaScript 判断浏览器类型及版本的方法 在网页开发过程中,有时候我们需要根据用户的浏览器类型和版本来执行特定的代码逻辑或调整界面布局。这是因为不同的浏览器在处理某些特性时可能存在差异,例如对新标准...

    JS识别各浏览器版本完整实例代码

    ### JS识别各浏览器版本完整实例代码 在前端开发过程中,我们经常会遇到需要针对不同浏览器进行兼容性处理的情况。为了能够更高效地实现这一目标,掌握如何通过JavaScript来判断用户所使用的浏览器类型及其版本是...

    Javascript图片文字识别插件JS-OCR.zip

    JavaScript图片文字识别插件JS-OCR是一个用于在前端实现OCR(Optical Character Recognition,光学字符识别)功能的工具。OCR技术允许程序从图像中提取文本,使得计算机能够识别和处理图像中的文字。在这个JS-OCR...

    javascript获取浏览器相关属性

    要获取浏览器的相关属性,尤其是识别浏览器类型,可以利用`navigator.userAgent`属性。这个属性返回一个包含浏览器版本信息的字符串。通过分析这个字符串,我们可以判断用户的浏览器类型。下面是一个简单的示例: `...

    浏览器通过摄像头识别二维码demo

    总之,“浏览器通过摄像头识别二维码demo”是一个利用WebRTC和JavaScript技术在浏览器中实现的交互式应用,它展示了如何通过摄像头捕获视频流,检测并解码二维码,以及处理浏览器的兼容性问题。这个项目对于学习Web...

    javascript 浏览器检测代码精简版

    javascript检测浏览器精简版,需要的朋友可以参考下。

    能够识别浏览器是否处于隐身模式

    "能够识别浏览器是否处于隐身模式"这个主题涉及到的是浏览器隐私模式的检测技术。虽然浏览器API没有直接提供这样的功能,但开发者可以通过一些间接的方式来推测浏览器的状态。 隐身模式是现代浏览器提供的一种隐私...

    识别微信浏览器

    在移动互联网领域,微信浏览器(WeChat Browser)的识别与判断是开发者经常遇到的问题,尤其在进行微信小程序、H5页面或微信内置浏览器适配时。这篇内容将深入讲解如何识别用户是否正在使用微信浏览器,并提供相关的...

    JavaScript学习笔记之检测客户端类型是(引擎、浏览器、平台、操作系统、移动设备)

    6. JavaScript检测代码:网上的各种代码通过检测UA字符串中的特定模式来识别浏览器、平台、操作系统、移动设备和游戏系统。例如,通过正则表达式检测字符串中是否含有“opera”可以判断用户是否使用Opera浏览器,...

    识别浏览器呈现引擎

    “源码”标签可能暗示文章提供了识别浏览器引擎的JavaScript代码示例,帮助开发者直接在网页中实现这一功能。“工具”可能意味着存在一些辅助工具或插件,可以帮助开发者更方便地检测和处理浏览器兼容性问题。 ...

Global site tag (gtag.js) - Google Analytics