IOS环境执行DOM操作JS代码时出现null is not an object报错求助

这个报错的核心原因很明确：你调用document.querySelector()查找元素时，找不到对应的DOM元素，返回了null，接着尝试访问null的classList属性，自然就触发了这个错误——iOS Safari对这类空值访问的报错提示比其他浏览器更直接。

下面分几种常见场景和对应的解决办法：

1. 数组中存在页面无对应元素的ID #

后端返回的tableIdsSold或tableIdsBook里，可能包含了页面中不存在的data-circleId值。比如数组里有38，但页面根本没有<xxx data-circleId="38">这个元素，此时querySelector会返回null。

解决办法：操作元素前先判断是否存在
修改你的循环逻辑，每次查找后先检查元素是否存在，再执行添加类名的操作：

// 处理已售桌号
for (var i = 0; i < tableIdsSold.length; i++) { 
    const targetElement = document.querySelector('[data-circleId="' + tableIdsSold[i] + '"]');
    // 先确认元素存在再操作
    if (targetElement) {
        targetElement.classList.add('purchased'); 
    }
}

// 处理已预订桌号，同理
for (var j = 0; j < tableIdsBook.length; j++) { 
    const targetElement = document.querySelector('[data-circleId="' + tableIdsBook[j] + '"]');
    if (targetElement) {
        targetElement.classList.add('booked'); // 这里替换成你需要添加的预订类名
    }
}

2. iOS WebKit的DOM渲染时序问题 #

虽然你把main.js放在</body>前，但在iOS Safari中，如果页面DOM结构较复杂，或者存在动态生成的DOM元素，有可能脚本执行时目标元素还没被完全解析渲染。

解决办法：等待DOM完全加载后再执行脚本
把所有DOM操作逻辑包裹在DOMContentLoaded事件回调里，确保浏览器已经解析完所有DOM节点：

document.addEventListener('DOMContentLoaded', function() {
    // 处理已售桌号
    for (var i = 0; i < tableIdsSold.length; i++) { 
        const targetElement = document.querySelector('[data-circleId="' + tableIdsSold[i] + '"]');
        if (targetElement) {
            targetElement.classList.add('purchased'); 
        }
    }

    // 处理已预订桌号
    for (var j = 0; j < tableIdsBook.length; j++) { 
        const targetElement = document.querySelector('[data-circleId="' + tableIdsBook[j] + '"]');
        if (targetElement) {
            targetElement.classList.add('booked');
        }
    }
});

3. ID值存在格式不匹配问题 #

比如数组中的ID是数字类型，而页面中data-circleId的属性值带前后空格、或者存在大小写不一致（虽然HTML属性本身不区分大小写，但选择器匹配会严格遵循字符串一致），都会导致查找失败。

解决办法：格式化ID值后再查找
可以把数组元素转为字符串并去除前后空格，同时用模板字符串让代码更清晰：

const id = String(tableIdsSold[i]).trim();
const targetElement = document.querySelector(`[data-circleId="${id}"]`);

先试试第一种办法（添加存在性判断），这是最常见的触发原因。如果还是不行，再结合第二种办法等待DOM加载完成，基本就能解决iOS下的报错问题了。

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