document.queryselector возвращает нулевое значение - PullRequest
Новая
       146

document.queryselector возвращает нулевое значение

0 голосов
/ 09 июля 2020

В настоящее время я создаю игру ti c ta c toe с HTML, CSS и Vanilla JS, и у меня есть кнопка настроек с id 'mode' и class 'settings-button 'для переключения между игроком против игрока и игроком против процессора (см. код ниже).

Когда я запускаю document.querySelector в классе кнопки, он возвращает нулевое значение, которое, в свою очередь, заставляет строку eventlistener вызывать ошибка (Uncaught TypeError: невозможно прочитать свойство addEventListener со значением null).

Я попытался использовать document.getElementById и поместить весь свой код в блок window.onload с обоими методами документа, но я испытал то же самое проблема во всех сценариях ios. Сначала я подумал, что это может быть проблема с подключением к Wi-Fi, так как я работаю над repl.it для этого проекта, но я проверил другие проекты с похожим кодом, и все они, похоже, работают нормально.

Что должно Я должен это исправить?

Изменить: я также пробовал использовать document.querySelectorAll, и он возвращает пустой список узлов. 

const modeButton = document.querySelector('settings-button');

let cpu = false;

function switchMode() {
  cpu = !cpu;
  this.textContent = cpu ? modeText[1] : modeText[0];
}

modeButton.addEventListener('click',switchMode);
<button id="mode" class="settings-button">Player vs Player</button>

1 Ответ

0 голосов
/ 09 июля 2020

вы используете settings-button как класс вместо .settings-button. добавить (.) Перед именем класса в методе querySelector 

const modeButton = document.querySelector('.settings-button');
...