如何在屏幕上显示输入值？

Question

我一直无法显示输入值。它显示未定义的标题和作者，并在我指定数字时完全忽略页面。链接 JS 小提琴：https : //jsfiddle.net/u3cb96x5/这是我尝试过的 - 我创建了一个名为 addBookToLibrary 的函数来查询 DOM 值并创建新的 Book 对象，但由于函数范围，我将无法访问这些变量。// Variablesconst addBook = document.querySelector("#add");// const remove = document.querySelector("#remove");let library = [];// Event ListenersaddBook.addEventListener("click", render);class Book {    constructor(title, author, pages, isRead) {        this.title = title;        this.author = author;        this.pages = pages;        this.isRead = isRead;    }}function addBookToLibrary() {    let authorOfBook = document.querySelector("#author").value;    let bookTitle = document.querySelector("#book-title").value;    let numberOfPages = document.querySelector("#pages").value;    let status = document.querySelector("#isRead").value;    let newBook = new Book(bookTitle, authorOfBook, numberOfPages, status);    library.push(newBook);}function render() {    addBookToLibrary();    let table = document.querySelector("table");    let tr = document.createElement("tr");    table.appendChild(tr);    tr.innerHTML = `<td>${this.title}</td>                    <td>${this.author}</td>                    <td>${this.pages}</td>                    <td><button class="table-buttons" id="not-read">Not Read</button></td>                    <td><button class="table-buttons" id="remove">Delete</button></td>`;}我希望它显示未定义的指定输入字段的值

Answer 1

使用数组而不是“this”

let book = library[library.length - 1];

<td>${book.title}</td>