Как поменять текст внутри div с помощью js?

360

29 октября 2021, 23:00

Я пытаюсь написать простую игру "города", и хочу что бы после того, как пользователь введет слово, оно отобразилось в div'e с id "last-word". Сейчас текст меняется на последнее введенное слово только после того, как закончится цикл. Можно ли сделать так, что бы текст менялся сразу же после arr.push(tmp); , не дожидаясь окончания цикла?

if(confirm("Хотите сыграть в \"Города?\"") == true) { 
	var firstround = true; 
	let arr = []; 
	let last; 
	while(true) { 
		var tmp = prompt("Введите город"); 
		last = arr[arr.length-1]; 
		if(!tmp) break; 
		if(firstround == true) { 
			firstround = false; 
			arr.push(tmp); 
			document.getElementById('last-word').innerHTML = arr[arr.length-1]; 
			continue; 
		} 
		if(last[last.length-1] == tmp[0]) { 
			arr.push(tmp); 
		} 
		else break; 
	} 
 
}

<!DOCTYPE html> 
<html> 
<head> 
	<title>DZ</title> 
	<meta charset="utf-8"> 
</head> 
<body> 
 
<div id="last-word"></div> 
<style type="text/css"> 
	h1 { display: flex; justify-content: center; } 
	#last-word { color: red; display: flex; width: 50%; justify-content: center; font-size: 24px; padding-top: 200px; } 
</style> 
<script src="script.js"></script> 
</body> 
</html>

Answer 1

Покажу решение, может прочитав его, это вам поможет

const cities = []; 
const cityList = document.getElementById('city-list'); 
 
const startGame = () => { 
  const cityName = prompt('Введите город', ''); 
 
  if (cityName === null) { 
    alert('Вы отменили ввод'); 
    return; 
  } else if (!cityName.length) { 
    alert('Пустое поле не допустимо'); 
    startGame(); 
  } else if (cities.includes(cityName.toLocaleLowerCase())) { 
    alert('Это имя уже было'); 
    startGame(); 
  } else if (cities.length && !cityName.toLocaleLowerCase().startsWith(cities[cities.length - 1].toLocaleLowerCase().substr(-1))) { 
    alert('Не верное назавание'); 
    startGame(); 
  } else { 
    const newRow = document.createElement('div'); 
    newRow.innerText = cityName; 
    cities.push(cityName); 
    cityList.appendChild(newRow); 
    window.setTimeout(startGame); 
  } 
}; 
 
if (confirm('Хотите сыграть в "Города?"')) { 
  startGame(); 
}

<div id="city-list"></div>

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

Все вопросы

ТОП-10

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

Не работает клик по элементу

Есть код:

207

javascript

JS Алгоритм добавления цифр в массив

Я хочу реализовать такое: Я добавляю задачу(элемент с классомtaskи атрибутом data-id) через input, а потом информация сохраняется в localStorage Я код написал...

101

javascript