JS нубский код

Общее
1

Недавно начал изучать JS и что-то с ним делать. Знаю, немножечко не по теме сайта, но всё же может кто-нибудь помочь?
Ошибка: Uncaught SyntaxError: Unexpected end of input
Код:

<script type="text/javascript" language="javascript"> 	     
while (true) do{
sleep(2000);
var i = 0;
i++;
var elm = document.getElementById("img");
if(i == 1){
			elm.className = "img2";
		}
		else if(i == 2){
			elm.className = "img1";
			}
		else if(i == 3){
			elm.className = "img2";
			i = 1;
			}
}
</script>
2

Странный у вас синтаксис. :confused:

Вот ссылки по теме:

Кроме того, в JS нет нативной функции sleep. Есть setTimeout и setInterval.

3

Код изменил, но браузер всё равно ругается на код.

<script type="text/javascript" language="javascript"> 	     
	var i = 0;
	var elm = document.getElementById("img");
	while (true){
	 setTimeout(2000);
	 i++;
	 if(i == 1){
 				elm.className = "img1";
			}
 			else if(i == 2){
 				elm.className = "img2";
				}
			else if(i == 3){
				elm.className = "img1";
				i = 1;
				}
	}
	</script>

4

Очевидно в разметке нет элемента с id img. Соответсвенно в переменной elm null.

Сет таймаут немного не так работает ) Он выболняет определённую функцию через промежуток времени один раз.

Кроме того, лучше пользоваться classlist для добавления и удаления классов.

1 лайк
5

Элемент имеется

<div id="img" height="400" width="1300"></div>

Но у меня сет таймаут в цикле, разве так не будет работать?

6

setTimeout работает не так ) Тут скорее нужен setInterval, чтобы запускать функцию циклично.

7

Проверьте, в каком месте расположен скрипт, так как DOM создается уже после загрузки страницы то соответственно если ваш скрипт выше этого DIVа на странице

<div id="img" height="400" width="1300"></div>

то и находить он его не будет, но скорей всего проблема в самом коде который некорректно работает, так как он будет очень здорово тормозить браузер. Если я вас правильно понял то я бы код переписал как то так.

<!DOCTYPE html>

<style type="text/css">
    .img1 {
        background-color: green;
    }

    .img2 {
        background-color: red;
    }
</style>

<div id="img" class="img2" style="height:400px;width:1300px;"></div>

<script type="text/javascript">
    function color() {
        var elm = document.getElementById("img");
        if (elm.className === "img2") {
            elm.className = "img1";
        }
        else {
            elm.className = "img2";
        }
    }
    setInterval(color,2000);
</script>