javascript - iOS Safari Javascript 无法运行，但可以在桌面和 Android 上运行

Question

此脚本的目的是根据查询字符串隐藏和显示图形元素。例如，website.com/repair-catalog?catalog=brand1。

该脚本适用于桌面设备和我见过的 Android 设备。但在 iOS Safari 上，该脚本似乎不起作用。

如果我访问过:website.com/repair-catalog?catalog=brand1 .

case "brand1"将开始并继续仅显示带有耳机、耳塞和扬声器的内部文本的数字。并隐藏其他人物。这再次适用于桌面版和 Android 版。但是当我在 iOS Safari 上访问该页面时，case "brand1"正在运行，但不显示耳机、耳塞和扬声器...脚本自动进入 default案例。

为什么此脚本在 Safari iOS 上的运行效果不如在桌面版和 Android 上的运行效果？它不应该隐藏所有数字。仅显示案例中不匹配的数字。

我尝试重写我的脚本，使其不使用 URLSearchParams , switch statements ，和forEach循环。但我最终仍然得到了与桌面和 Android 相同的结果，但在 Safari iOS 上却不行。在 Safari iOS 上，默认情况始终运行。

注意，我已经检查了 typeof figure.innerText它是一个字符串，这意味着它应该匹配 case "brand1" 。它在桌面和 Android 上正确执行此操作。

const catalogQuery = new URLSearchParams(document.location.search);
const catalogType = catalogQuery.get("catalog")
const nodeList = document.querySelectorAll(".figure-wrapper a figure");
const x = [...nodeList];
try {
    if (catalogType !== null) {
        switch (catalogType) {
            case "brand1":
                x.forEach(figure => {
                    switch (figure.innerText) {
                        case "HEADPHONES":
                            figure.style.display = "block";
                            figure.parentElement.attributes[0].value = "/headphones";
                            break;
                        case "EARBUDS":
                            figure.style.display = "block";
                            figure.parentElement.attributes[0].value = "/earbuds";
                            break;
                        case "SPEAKERS":
                            figure.style.display = "block";
                            figure.parentElement.attributes[0].value = "/speakers";
                            break;
                        default: 
                            figure.parentElement.style.display = "none";
                            break;
                    }
                });
                break;
           default:
                location.href = "/repair-catalog";
                break;
        }
    }
} catch (err) {
    console.log(err);
}

Answer 1

URLSearchParams 并非所有版本的 safari 或更旧的浏览器都支持。

请使用 polyfill 或拆分 url 参数并使用查询参数值。