#javascript #dom
#язык JavaScript #дом
Вопрос:
поэтому я попытался добавить .значение в двух разных местах, и я просто хотел бы знать, почему
HTML-код :
lt;!DOCTYPE htmlgt; lt;html lang="en"gt; lt;headgt; lt;meta charset="UTF-8" /gt; lt;meta name="viewport" content="width=device-width, initial-scale=1.0" /gt; lt;meta http-equiv="X-UA-Compatible" content="ie=edge" /gt; lt;link rel="stylesheet" href="style.css" /gt; lt;titlegt;Guess My Number!lt;/titlegt; lt;/headgt; lt;bodygt; lt;headergt; lt;h1gt;Guess My Number!lt;/h1gt; lt;p class="between"gt;(Between 1 and 20)lt;/pgt; lt;button class="btn again"gt;Again!lt;/buttongt; lt;div class="number"gt;?lt;/divgt; lt;/headergt; lt;maingt; lt;input type="number" class="guess" name="number" /gt; lt;button class="btn check"gt;Check!lt;/buttongt; lt;script src="script.js"gt;lt;/scriptgt; lt;/bodygt; lt;/htmlgt;
код javascript 1 :
var input = document.querySelector(".guess").value const check = document.querySelector(".check") const message = document.querySelector(".message") var score = document.querySelector('.score') var highScore = document.querySelector('.highscore') check.addEventListener("click", function(){ console.log(input) })
результат : не будет регистрировать входное значение
код javascript 2 :
var input = document.querySelector(".guess") const check = document.querySelector(".check") const message = document.querySelector(".message") var score = document.querySelector('.score') var highScore = document.querySelector('.highscore') check.addEventListener("click", function(){ console.log(input.value) })
результат: будет регистрировать входное значение
Комментарии:
1. В вашем первом примере записывается входное значение, но оно пустое, потому что вы сохранили значение один раз до ввода каких-либо входных данных. Во втором примере элемент ввода сохраняется, а затем извлекается его значение в обработчике щелчка.
2. @pilchard да, большое спасибо, теперь я все понимаю, спасибо
Ответ №1:
В первом случае он получает значение при загрузке страницы, во втором, когда вы нажимаете кнопку, он снова получает значение, обновленное с помощью ввода