时间戳

首页 > 解决方案 > 我的包含 js 和 html 的代码有问题

javascript - 我的包含 js 和 html 的代码有问题

问题描述

我是初学者，我的 JavaScript 代码有问题。有人可以告诉我这里出了什么问题，因为代码不起作用

document.addEventListener('DOMContentLoaded', function() {
  function redf() {
    document.querySelector('h1').style = 'red';
  };
  document.querySelector('#red').onclick = redf();
});
<h1>Hello, World!</h1>
<div>
  <button id="red" style="color: red;">Red</button>
  <button id="blue" style="color: blue;">Blue</button>
  <button id="green" style="color: springgreen;">Green</button>
</div>

标签： javascripthtml

解决方案

您的代码有两个问题。

  1. style= 'red';应该style.color = 'red';
  2. onclick = redf();应该是onclick = redf;。调用()函数

document.addEventListener('DOMContentLoaded', function() {
  function redf() {
    document.querySelector('h1').style.color = 'red';
  };
  document.querySelector('#red').onclick = redf;
});
<h1>Hello, World!</h1>
<div>
  <button id="red" style="color: red;">Red</button>
  <button id="blue" style="color: blue;">Blue</button>
  <button id="green" style="color: springgreen;">Green</button>
</div>

推荐阅读