时间戳

首页 > 解决方案 > 无法读取“null”的属性（读取 appendChild）

javascript - 无法读取“null”的属性（读取 appendChild）

问题描述

谁能告诉我我的代码有什么问题？这适用于页面上的所有其他元素，但不适用于所有元素的父元素。

let addButton = document.querySelector('.add-note');
addButton.addEventListener('click', (event) => {
  //prevent refresh
  event.preventDefault();
  //note input value
  let noteInput = document.querySelector(".note-input");
  //create note container
  let noteList = document.querySelector(".notes");
  //create note
  let note = document.createElement("li");
  note.classList.add("note");
  noteList.appendChild(note);
});
<div class="title">
  <h1>To Do List</h1>
</div>
<br>
<form>
  <div class="add-note">
    <input class="note-input" type="text" placeholder="Enter to-do item here"></input>
    <button class="add" type="submit">+</button>
  </div>
</form>
<br>
<ul className="notes" id="notes"></ul>

标签： javascript

解决方案

这是一个 React 项目吗？className仅在使用 React 时可用。

<ul className="notes" id="notes"></ul>

改成

<ul class="notes" id="notes"></ul>

推荐阅读