如何使用纯JavaScript检测iOS设备并仅展示一次提示横幅

你的代码存在3个核心错误，导致脚本完全无法运行： #

1. if判断语法完全错误
   你写的代码里出现了两个并列的if关键字，且&&逻辑运算符放在了if的括号外部，不符合JavaScript基础语法，JS引擎解析到这里直接抛出语法错误，导致整个脚本停止执行。
2. indexOf方法逻辑写反
   Array.indexOf()方法匹配到元素时返回元素的索引值（从0开始），匹配失败返回-1。你当前写的!["iPhone", "iPad", "iPod"].indexOf(a)只有当a的值是数组第一个元素iPhone时才会返回true，即使语法修复后也匹配不到iPad、iPod设备。
3. （可选）iPadOS适配问题
   新版iPadOS的navigator.platform默认返回MacIntel，仅靠platform判断会漏掉iPad设备，可以补充UA判断做兼容。
   另外你的HTML代码里<div class="cookie-banner">少写了开头的<，如果不是粘贴失误也需要修正。

修正后的可运行脚本： #

const cookieBanner = document.querySelector(".cookie-banner");
const cookieButton = document.querySelector(".cookie-btn");
const ua = window.navigator.userAgent;
const platform = window.navigator.platform;

// 检测是否为iOS设备（包含新版iPadOS）
const isIOS = /iPhone|iPad|iPod/.test(ua) || (platform === 'MacIntel' && navigator.maxTouchPoints > 1);

cookieButton.addEventListener("click", () => {
  cookieBanner.classList.remove("active");
  localStorage.setItem("cookieBannerDisplayed", "true");
});

setTimeout(() => {
  // 同时满足：未展示过横幅 + 是iOS设备 才展示
  if (!localStorage.getItem("cookieBannerDisplayed") && isIOS) {
    cookieBanner.classList.add("active");
  }
}, 2000);

内容的提问来源于stack exchange，提问作者Today's Acapellas