首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >无法设置属性innerText

无法设置属性innerText
EN

Stack Overflow用户
提问于 2022-08-23 16:07:55
回答 2查看 100关注 0票数 0

html:

代码语言:javascript
复制
<!DOCTYPE html>
<html>
    <head>
<script src="plm.js"></script>
    </head>
    <body>
<h1 id="element">number</h1>
<button onclick="bruh()">Add Num</button>

    </body>



</html>

js

代码语言:javascript
复制
let nr = 0
let change = document.getElementById("element")
function bruh(){
    nr = nr + 1
 change.innerText = nr
}

我得到了一个错误"plm.js:5 Uncaught TypeError:无法设置空属性“(设置'innerText')

我知道,如果我编写例如document.getElementById(element).innerText = nr,它就会工作,但是当我使用replit来编写代码时,它可以将它放入变量中,但是vscode是不一样的。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2022-08-23 16:11:49

这一行很可能是:

代码语言:javascript
复制
   let change = document.getElementById("element")

..。在DOM中的#元素h1之前调用。

一个快速的解决方法是将这一行移动到单击回调中,如下面所示。

一个可能更好的解决方法是将脚本的执行推迟到您知道元素在dom中的时候,例如:DOMContentLoaded事件

评论者指出的其他选项包括使用延时属性或将<script>标记移至关闭的</body>标记之前。

代码语言:javascript
复制
let nr = 0
function bruh(){
   let change = document.getElementById("element")
    nr = nr + 1
 change.innerText = nr
}
代码语言:javascript
复制
<h1 id="element">number</h1>
<button onclick="bruh()">Add Num</button>

票数 2
EN

Stack Overflow用户

发布于 2022-08-23 16:13:44

您的javascript文件在访问DOM之前正在运行。

改变这一点:

代码语言:javascript
复制
<script src="plm.js"></script>

对此:

代码语言:javascript
复制
<script src="plm.js" defer></script>

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#attr-defer

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/73461924

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档