Событие нажатия кнопки не сработает - PullRequest
0 голосов
/ 20 февраля 2019

Пожалуйста, помогите.Задача: «Напишите программу на JavaScript, чтобы вращать строку« w3resource »в правильном направлении, периодически удаляя одну букву из конца строки и прикрепляя ее к передней части».


function moveIt() {
    var element = document.getElementById("target");
    var textNode = element.childNodes[0];
    var text = textNode.nodeValue;

    setInterval(function() {
        text = text[text.length - 1] + text.substring(0, text.length - 1);
        textNode.nodeValue = text;
    }, 500);
}
<body>    
  <button type="button" onclick="animate('target')">click to animate</button>    
  <p id="target">w3resource</p>
</body>

Функция работает, когда я применяю ее к событию onload в document.body, но она не работает с кнопкой.Что я сделал не так?

Ответы [ 2 ]

0 голосов
/ 20 февраля 2019

Я думаю, что вы вызывали зарезервированное имя метода, также вы использовали строковые значения, а не переменные.Изменено на foo и работает нормально.

<body>

<button type="button" onclick="foo('target')">click to animate</button>

<p id="target">w3resource</p>
<script>
function foo(target){
            var element = document.getElementById(target);
            var textNode = element.childNodes[0];
            var text = textNode.nodeValue;

            setInterval(function() {
                text = text[text.length - 1] + text.substring(0, text.length - 1);
                textNode.nodeValue = text;
            }, 500);
        }
</script>
</body>
0 голосов
/ 20 февраля 2019

Имя animate уже используется DOM.Просто измените название функции.Это будет работать.

И нет необходимости устанавливать параметр функции, так как вы получаете элемент по идентификатору.

function moveIt() {
    var element = document.getElementById("target");
    var textNode = element.childNodes[0];
    var text = textNode.nodeValue;

    setInterval(function() {
        text = text[text.length - 1] + text.substring(0, text.length - 1);
        textNode.nodeValue = text;
    }, 500);
}
<body>
  <button type="button" onclick="moveIt()">click to animate</button>
  <p id="target">w3resource</p>
</body>
...