如何通过内联JS/jQuery为Android设备设置<a>标签跳转链接

可以通过内联JavaScript（或jQuery）检测设备类型，给「返回首页」按钮绑定差异化跳转逻辑，以下是两种实现方案：

方案1：使用jQuery实现 #

需要先引入jQuery库，再添加点击事件处理逻辑：

<body>
  <a class="android">返回首页</a>

  <!-- 引入jQuery -->
  <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
  <script>
    $(function() {
      $('.android').click(function() {
        // 检测是否为Android设备
        const isAndroid = /Android/i.test(navigator.userAgent);
        // 根据设备类型设置跳转地址
        window.location.href = isAndroid ? 'https://x.com' : 'https://z.com';
      });
    });
  </script>
</body>

方案2：原生JavaScript实现（无需依赖库） #

不想引入jQuery的话，直接用原生JS就能完成：

<body>
  <a class="android">返回首页</a>

  <script>
    // 等待DOM加载完成
    document.addEventListener('DOMContentLoaded', function() {
      const backButton = document.querySelector('.android');
      backButton.addEventListener('click', function() {
        const isAndroid = /Android/i.test(navigator.userAgent);
        window.location.href = isAndroid ? 'https://x.com' : 'https://z.com';
      });
    });
  </script>
</body>

关键说明 #

• 用正则表达式/Android/i匹配浏览器用户代理字符串，判断当前设备是否为Android（i标记忽略大小写，避免漏匹配大小写不同的情况）
• 点击事件触发时，根据检测结果跳转至对应地址
• 两种方案均为内联代码，直接嵌入HTML文档即可使用

内容的提问来源于stack exchange，提问作者Nooshin