Firefox返回TypeError: document.getElementById(..)为空，但Chrome工作正

Firefox returns TypeError: document.getElementById(...) is null but Chrome works fine

本文关键字：为空 Chrome 工作 TypeError 返回 document getElementById Firefox      更新时间：2023-09-26

我已经看到了很多关于这个的问题，我想我已经浏览了几乎所有的问题，但还没有找到解决我问题的方法。

正如我在标题中提到的，Firefox(和IE)返回这个异常TypeError: document.getElementById(...) is null，而Chrome和Safari工作得很好。

我在网上有代码，你可以在这里查看:http://178.62.244.224/(该网站是葡萄牙语的，但与此问题无关)。

问题:当点击左边的一个改进时，Chrome的行为与预期一样，并在通过Ajax加载新内容时切换复选框。在Firefox中执行此操作时，复选框不会切换(但是ajax调用可以工作，因为内容发生了变化)，并且前面提到的异常会显示在控制台中。

它指向的代码位于getElementById行中此函数的script.js (http://178.62.244.224/static/script.js)中:

function toggleAllFilters(filters) {
    for (i = 0; i < filters.length; i++){
        var filter = filters[i];
        document.getElementById(filter).checked = true;
    }
};

这个函数在getFilters()中被ajax调用:

$.get(url, function (response) {
            document.open();
            document.write(response);
            document.close();
            toggleAllFilters(filters);
        });

正如在其他类似问题中指出的那样，这似乎与这样一个事实有关，即在执行document.getElementById时，页面可能尚未完全加载并且未找到元素。出于这个原因，我已经将script.js移动到</body>之前的页面末尾，但这没有效果。

很明显，Firefox/IE以不同的方式解释这一点，但我真的不知道是什么方式。什么好主意吗?

将选择器用引号括起来。

getElementById('filter')

你在上面寻找的是一个变量指针，而不是一个实际的DOM元素。

相关文章：