html5 如何识别客户端

在HTML5中，可以使用navigator.userAgent属性来识别客户端，该属性返回一个包含浏览器标识符的字符串，可以根据该字符串来判断用户使用的浏览器类型和版本。

以下是一些常见的浏览器标识符及其对应的小标题和单元表格：

1、Chrome浏览器

小标题：Chrome浏览器标识符

单元表格：

Chrome/89.0.4389.82 Safari/537.36

Chrome/89.0.4389.82 Edge/Safari/537.36 Edg/89.0.774.50

Chrome/89.0.4389.82 Mobile Safari/537.36

2、Firefox浏览器

小标题：Firefox浏览器标识符

单元表格：

Gecko/20100101 Firefox/89.0

Gecko/20100101 SeaMonkey/2.6.12

3、Safari浏览器

小标题：Safari浏览器标识符

单元表格：

AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.4 Safari/605.1.15

AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Safari/605.1.15

4、Internet Explorer浏览器

小标题：Internet Explorer浏览器标识符

单元表格：

Trident/7.0; rv:11.0

Trident/6.0

5、Edge浏览器

小标题：Edge浏览器标识符

单元表格：

Edg/89.0.774.50

Edg/79.0.309.43

通过解析navigator.userAgent属性中的字符串，可以提取出上述标识符，并根据需要判断用户所使用的浏览器类型和版本，以下是一个示例代码，用于识别客户端并输出相应的信息：

<div id="browserInfo"></div>
<script>
  var userAgent = navigator.userAgent;
  var browserInfoDiv = document.getElementById("browserInfo");
  
  if (userAgent.indexOf("Chrome") > 1) {
    var version = userAgent.match(/b(Chrome|Chromium)/(d+)/);
    browserInfoDiv.innerHTML = "您正在使用 Chrome 浏览器，版本号为：" + version[2];
  } else if (userAgent.indexOf("Firefox") > 1 || userAgent.indexOf("Gecko") > 1) {
    var version = userAgent.match(/bFirefox/(d+)/);
    browserInfoDiv.innerHTML = "您正在使用 Firefox 浏览器，版本号为：" + version[1];
  } else if (userAgent.indexOf("Safari") > 1 && userAgent.indexOf("AppleWebKit") > 1) {
    var version = userAgent.match(/bAppleWebKit/(d+)s(S+)s(d+)/);
    browserInfoDiv.innerHTML = "您正在使用 Safari 浏览器，版本号为：" + version[2];
  } else if (userAgent.indexOf("Trident") > 1) {
    browserInfoDiv.innerHTML = "您正在使用 Internet Explorer 浏览器";
  } else if (userAgent.indexOf("Edg") > 1) {
    var version = userAgent.match(/bEdg/(d+)/);
    browserInfoDiv.innerHTML = "您正在使用 Edge 浏览器，版本号为：" + version[1];
  } else {
    browserInfoDiv.innerHTML = "无法识别您的浏览器类型";
  }
</script>