Question

我收到了错误：

无法阅读属性＆inner;内部HTML＆＃39;为null

我已经查看了stackoverflow上的其他答案，其中很多都是使用$(document).ready来解决的，虽然这解决了我的问题但在我的情况下并不是很有效页面加载dom的时间有时非常慢（+7秒），我宁愿只要id可用，我就可以使用它。

我有办法做到这一点吗？我一直看着.on()试图查看id是否存在但不确定它是否可以这样使用，因为我目前使用它的方式意味着该方法从未使用过。

包含在头部的javascript文件，jsp中的id进一步向下。

使用$(document).ready：

$(document).ready(function() {
        updateContainerCount();
        function updateContainerCount() {
            var countElement = document.getElementById("countElement");
            if (count > 0) {
                countElement.innerHTML += ' (' + count + ')';
            }
        }
});

使用.on()之类的内容：

$('#countElement').on("load", function() {
        updateContainerCount();
        function updateContainerCount() {
            var countElement = document.getElementById("countElement");
            if (count > 0) {
                countElement.innerHTML += ' (' + count + ')';
            }
        }
});

Answer 1

只要您确定已加载DOM元素，就可以直接使用DOM元素进行操作。

例如，您可以在HTML声明之后立即放置一部分代码：

<div id="countElement"></div>
<script>
    var countElement = document.getElementById("countElement");
    if (count > 0) {
        countElement.innerHTML += ' (' + count + ')';
    }
</script>

我很确定它不被认为是一种好的做法，但有时候我会在我的项目中使用这种方法 - 在非常重要的地方，在元素DOM加载后立即执行脚本，无需等待文件加载。

P.S。看起来您可能可以在后端设置此HTML。如果是，那么在服务器端生成它肯定更好。

Answer 2

如果你正在编写函数体，那么就不需要在document.ready中的同一个地方调用它，我认为你必须像下面的代码一样调用它

首先编写你的document.ready并且只调用函数从那里写下函数体如下

$('#countElement').on("load", function() {
    updateContainerCount();
 });

然后在document.ready block

之外编写函数体

function updateContainerCount() {
        var countElement = document.getElementById("countElement");
        if (count > 0) {
            countElement.innerHTML += ' (' + count + ')';
        }
    }

可能会帮助你

解决无法读取属性＆inner;内部HTML＆＃39;使用.on（）的null？

2 个答案: