Я думаю, чтобы понять, что происходит, вы можете использовать эту иллюстрацию, запустите этот фрагмент в вашей консоли
let h1 = document.querySelector('h1');
console.log('Confused', h1);
let h11 = document.querySelector('h1');
console.log('Confused', h11);
console.log('Got it', h1);
Это без h1.innerText = 'Inserted';
и соблюдайте значения h1
и h11
.
и затем выполните эту команду
h1.innerText = 'Inserted';
. Снова наблюдайте значения h1
и h11
в консоли.Вы поймете, что они были обновлены до той же самой вещи с innerText
, чтобы быть Inserted
.
Теперь запустите это
let h1 = document.querySelector('h1');
console.log('Confused', h1);
let h11 = document.querySelector('h1');
console.log('Confused', h11);
h1.innerText = 'Inserted';
console.log('Got it', h1);
Заметьте, что конечный результат - это то, что вы получили послеработает h1.innerText = 'Inserted';
Теперь, что происходит?JavaScript variables are containers for storing data values.
Вы видите, что переменные - это просто контейнеры для хранения данных.До появления строки h1.innerText = 'Inserted';
у них был контент, который вы ожидали получить, но когда эта строка запускает, их контент меняется, и вы получаете то, что наблюдаете.Проблема в том, что это происходит так быстро, что вы не видите первые версии h1
и h11
и видите только их обновленные версии, потому что на самом деле это просто контейнеры для хранения данных, а не сами данные, или вы можетеименуйте их как the name of a storage location