首页 > 解决方案 > getElementById 在类方法中不起作用

问题描述

HTML:

<div id='verse'>
    <p id='text'>
        <span id = 'reference'>random stuff here</span> 
     random stuff here
     </p>
  </div>

JS:

class Verse {
  ...
  update() {
    document.getElementById('text').innerHTML = 'text';
    document.getElementById('reference').innerHTML = 'reference';
  }
  ...
}

每当我调用.update. 也不适用于 innerText 。如果我在课堂外更改它,它工作正常。谢谢您的帮助!VerseTypeError: Cannot set properties of null

标签: javascripthtml

解决方案


设置innerHTMLon会完全#text替换整个内容<p>,因此当您随后尝试访问时#reference,它不再存在。

避免这种情况的最简单方法是添加另一个 span 并替换其文本而不是整个<p>.

<div id='verse'>
  <p>
    <span id='reference'>random stuff here</span> 
    <span id='text'>random stuff here</span>
  </p>
</div>

推荐阅读