javascript - 内容变化的模态

Question

我正在名为 modal.html 的文件中创建一个模态，并且填充该模态的内容来自外部 JS 文件。内容是名为 one.js 的 JS 文件中以下函数返回的字符串:

function current()
{
  if(selection === 0 && yesResources[questionsCounter] != null)
  {
    return yesResources[questionsCounter];
  }
  else if(selection === 1 && noResources[questionsCounter] != null)
  {
  return noResources[questionsCounter];
  }
  else
  {
    return 'You are on the right track!';
  }
}

为模态编写的 HTML 代码如下:

<!-- The Modal -->
<div id="myModal" class="modal">

    <!-- Modal content -->
    <div class="modal-content">
        <div class="modal-header">
           <span class="close">&times;</span>
           <h2>Resources</h2>
        </div>
    <div class="modal-body">
        <p>Test</p>
        <p id='modalContent'></p>
    </div>
    <div class="modal-footer">
        <h3>Living Progress</h3>
    </div>
  </div>
</div>

我想调用 current() 函数来用 id 'modalContent' 填充段落空间。我尝试过使用 document.getElementById("modalContent").innerHTML = current()、document.getElementById("modalContent").textContent = current()、在段落标签之间调用函数等。还有其他建议吗？谢谢。

Answer 1

您在输入 document.getElementById() 时忘记了 id 名称，我建议您使用 document.querySelector('#modalContent')，因为这样它也可以应用于选择类名或标记名。