有没有办法从 Javascript 函数中更改 <p> 元素的 HTML 内容？答案

【问题标题】：Is there a way to change HTML content of a <p> element from within a Javascript function?有没有办法从 Javascript 函数中更改 <p> 元素的 HTML 内容？
【发布时间】：2021-03-22 17:58:39
【问题描述】：

我想从一个 javascript 函数中更改我网页的 HTML 内容。我的 HTML 如下所示：

<div class="chartInfo">
  <p id="last_updated">Hello</p>
</div>

我的 Javascript 函数是对 GoogleCharts 查询的 QueryResponse。它看起来像这样：

<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});

function function_1() {
    var queryString = encodeURIComponent('SELECT AA, AB');
    var query = new google.visualization.Query('https://docs.google.com/spreadsheets/d/1dXP9yGEzNlmRxwCr2kyMM9CcS5hloIxKvef0RSa10/gviz/tq?gid=559927965&headers=1&tq=' + queryString);
      query.send(function_2);    
      };

function function_2(response) {
      if (response.isError()) {
        alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
        return;
      };
      var data = response.getDataTable();
      var t = (data.getvalue(0,0));
      var latest_time = t.getDate()
      document.getElementById("last_updated").innerHTML = "Last updated: " + latest_time;
      };

</script>

目前网页显示的是“Hello”而不是“Last Updated:” + latest_time，正如我想要的那样。

我认为这可能是范围的问题 - 当我在下面编写脚本时，我可以使用 document.getElementById 将其从“Hello”更改为另一个字符串，但是我无法访问 function_2 中的变量 latest_time。

提前感谢您的帮助！

【问题讨论】：

你定义了function_1，但你从来没有用它做任何事情。为什么它会有任何影响？
您的代码更新innerHTML 是执行此操作的方法之一，您的getElementById 调用是正确的。你有没有打电话给function_1？查询是否完成并调用function_2？您在浏览器控制台和/或网络选项卡中看到了什么？
是这个函数 --- function refreshIframe1D() { var frame = document.getElementById("Frame"); frame.src = "someurl.co.uk"; function_1(frame.src); --- 在页面加载时被调用，所以我认为这应该意味着 function_1 和 function_2 被调用？

标签： javascript html dom scope innerhtml

【解决方案1】：

将 dom.innerHTML 更改为 dom.textContent 以更改其文本

【讨论】：

虽然这通常是一个很好的建议（当输入不是已知安全的 HTML 时），但我看不出它如何解决问题。如果innerHTML 当前无效，则将其更改为innerText 也不会。
感谢您的建议，但正如昆汀所说，这仍然对
元素没有影响。 innerHTML 在 function_2 之外工作，但我需要使用 function_2 中的变量，我找不到将局部变量拉入全局范围的方法
我错过了话题，对不起
@HL589 为了将局部变量拉到全局范围，您可以全局声明它，或者将这些变量作为参数传递给另一个函数
@HL589 是的，你做对了。当您在其他两个函数之上像这样全局声明它时：var lastest_time;，Javascript 会自动将其初始化为 undefined，这与您得到的相同。所以我认为function_2 永远不会运行。您想通过 console.log() 查看它是否实际运行