Ошибка JS "Uncaught TypeError: Cannot read property 'classList' of null "

105

09 ноября 2021, 05:10

Помогите пожалуйста! Пишу тетрис на JS и все время выдает ошибку! Я новичок, поэтому не пинайте за мой код.

Эта функция отвечает за движение объектов:

function move(){ 
	//START MOVE FLAG FO FIGURE 
    moveFlag = true; 
 
 
	let coordinates = [ 
		[bodyFigure[0].getAttribute('posX'), bodyFigure[0].getAttribute('posY')], 
		[bodyFigure[1].getAttribute('posX'), bodyFigure[1].getAttribute('posY')], 
		[bodyFigure[2].getAttribute('posX'), bodyFigure[2].getAttribute('posY')], 
		[bodyFigure[3].getAttribute('posX'), bodyFigure[3].getAttribute('posY')], 
	]; 
 
	for (let i = 0; i < coordinates.length; i++){ 
		if (coordinates[i][1] == 1 || document.querySelector(`[posX = "${coordinates[i][0]}"][posY = "${coordinates[i][1]- 1} "]`).classList.contains('set')) {//Проблемное место 
			moveFlag = false; 
			 
			break; 
		} 
	} 
 
	if (moveFlag) { 
		for (let i = 0; i < bodyFigure.length; i++) { 
		bodyFigure[i].classList.remove('figure'); 
	} 
	bodyFigure = [ 
		document.querySelector(`[posX = "${coordinates[0][0]}"][posY = "${coordinates[0][1] - 1}"]`), 
		document.querySelector(`[posX = "${coordinates[1][0]}"][posY = "${coordinates[1][1] - 1}"]`), 
		document.querySelector(`[posX = "${coordinates[2][0]}"][posY = "${coordinates[2][1] - 1}"]`), 
		document.querySelector(`[posX = "${coordinates[3][0]}"][posY = "${coordinates[3][1] - 1}"]`), 
	]; 
	for (let i = 0; i < bodyFigure.length; i++) {  
		bodyFigure[i].classList.add('figure'); 
 
	} 
} 
	else{ 
		for (let i = 0; i < bodyFigure.length; i++) { 
		bodyFigure[i].classList.remove('figure'); 
		bodyFigure[i].classList.add('set'); 
	} 
	create(); 
} 
	 
} 
 
 
setInterval(() => { 
	move(); 
}, 300);

*{ 
	box-sizing: border-box; 
	font-family: Arial; 
} 
 
.tetris{ 
	position: absolute; 
	width: 500px; 
	height: 900px; 
	display: flex; 
	flex-wrap: wrap; 
	bottom: 0; 
	background-color: #FFF; 
	overflow: hidden; 
 
} 
.main{ 
	margin: 50px auto; 
	position: relative; 
	width: 500px; 
	height: 700px; 
	border:1px solid black; 
	overflow: hidden; 
} 
.excel{ 
	width:50px; 
	height: 50px; 
	border: 1px solid #CCC; 
} 
.figure, .set{ 
	background-color: blue; 
}

<!DOCTYPE html> 
<html> 
    <head> 
        <meta charset="UTF-8"> 
        <link rel="stylesheet" type="text/css" href="style.css"> 
    </head> 
    <body> 
        <div class="main"></div> 
        <script src="game.js"></script> 
    </body> 
</html>

Answer 1

ошибка говорит что не получилось найти элемент с таким селектором. проверьте, точно ли нужен пробел здесь [posY = "${coordinates[i][1]- 1} "] - между } " ну и потом, если пробел и правдп нужен, что элемент такой существует

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Не получается использовать картинки в React

Перерыл много страниц с тем, где пишут, как использовать картинки из папки с проектом, делаю так, к примеру:

javascript

Как найти определённых людей из участников группы вконтакте

Есть группа вконтакте в которой среди участников мне нужно выбрать всех девушек по имени Люба или ЛюбовьПосле этого желательно выбрать по возрастному...

195

javascript