Question

你好，我每隔3秒钟就试着改一个单词。

剧本：

<script type="text/javascript">
    var text = ["Fysioterapeut", "Kiropraktor", "Praktiserende læge"];
    var counter = 0;
    var elem = document.getElementById("changeText");
    setInterval(change, 3000);
    function change() {
     elem.innerHTML = text[counter];
        counter++;
        if(counter >= text.length) { counter = 0; }
    }
</script>

PHP / HTMl

$title =  "FIND DEN RIGTIGE <span id='changeText'>Fysioterapeut</span> i dag";

控制台说elem是NULL？那是为什么？

脚本运行清晰但文本没有变化。有谁知道为什么？

Answer 1

这里实际上发生的事情是你的java脚本首先加载，但那时它会检查html元素，并且当时不可用。

所以javascrpt代码应该低于你指定的php代码。

让示例代码如下所示。

<html>
<head>

</head>
<body>

<?php 
echo "FIND DEN RIGTIGE <span id='changeText'>Fysioterapeut</span> i dag"; 
?>

<script type="text/javascript">
    var text = ["Fysioterapeut", "Kiropraktor", "Praktiserende læge"];
    var counter = 0;
    var elem = document.getElementById("changeText");
    setInterval(change, 1000);
    function change() {
     elem.innerHTML = text[counter];
        counter++;
        if(counter >= text.length) { counter = 0; }
    }
</script>

</body>
</html>

现在它会起作用。因为现在javascript可以找到html elament。

Answer 2

span内的文字没有变化，因为每次调用change()时都会声明它！

以下是解决方案：WORKING DEMO

$( document ).ready(function() {
    setInterval(change, 3000);
});
var counter = 0;
function change() {
    var text = ["Fysioterapeut", "Kiropraktor", "Praktiserende læge"];
    var elem = document.getElementById("changeText");
    elem.innerHTML = text[counter];
    counter++;
    if(counter >= text.length) { counter = 0; }
}

Javascript Counter - 更改InnerHtml

2 个答案: