无jQuery实现按钮点击修改标题文本的问题求助

你的代码里有个基础错误：把innerHTML当成函数调用了。在原生JS里，innerHTML是元素的属性，得用赋值运算符=来设置内容，不是加括号传参。

修正后的代码 #

JavaScript部分 #

document.querySelector(".btn").addEventListener("click", function() {
  document.querySelector("h1").innerHTML = "hola como estas";
});

完整可运行示例 #

<h1 class="title">HELLO</h1>
<button class="btn" type="button"> Click me</button>

<script>
document.querySelector(".btn").addEventListener("click", function() {
  document.querySelector("h1").innerHTML = "hola como estas";
});
</script>

额外补充 #

• 如果你想用getElement系列方法，写法如下：

  // 获取元素（注意getElementsBy系列返回类数组，要取索引）
  const btn = document.getElementsByClassName("btn")[0];
  const title = document.getElementsByTagName("h1")[0];
  
  btn.addEventListener("click", function() {
    title.innerHTML = "hola como estas";
  });
  

• 要是只想修改纯文本，推荐用textContent，它不会解析HTML标签，更安全：

  document.querySelector("h1").textContent = "hola como estas";
  

内容的提问来源于stack exchange，提问作者Gero Sciortino