在這種情況下，為什么我無法獲得 input.value？

Question

我想通過這段代碼獲得一個 input.value。 將值存儲在

const inputName

const target = document.querySelector(".attend");
const inputName = document.getElementById("input")
const attendee = document.getElementById("attendee");

function attend() {
  attendee.textContent = inputName.value

}
target.addEventListener('click', attend);

但是此代碼無法獲得 input.value

下面的代碼有效。

const target = document.querySelector(".attend");
const inputName = document.getElementById("input").value
const attendee = document.getElementById("attendee");

function attend(inputName) {
  attendee.textContent = inputName
}

第一個代碼和第二個代碼之間的區別是

const inputName = document.getElementById("input")

const inputName = document.getElementById("input").value

我想在像這樣使用第一個代碼的“attend()”函數中獲得一個 input.value

const inputName = document.getElementById("input")

function attend(inputName) {
  attendee.textContent = inputName.value
}

但是當我通過 console.log() 檢查值時。

它沒有得到 input.values。

是全局、局部變量的問題嗎？ 還是其他原因？

Answer 1

這兩個示例對我來說都很好，我認為您的問題可能是元素在獲得值之前以某種方式被刪除或更改。