Question

我正在网站上工作，我需要做一个幻灯片。我的代码如下：

var quotes = new Array();

quotes[0] = "ola mundo";
quotes[1] = "quote2";
quotes[2] = "quote3";
quotes[3] = "quote4";
quotes[4] = "quote5";
console.log(quotes);
var counter = 0;

function loop() {
    if (counter > 4) counter = 0;
    document.getElementById('textslide').firstElementChild.innerHTML = quotes[counter];
    counter++;
    console.log(counter);
    setTimeout(loop, 2000);
}
loop();

和HTML：

<div id="textslide">
<p></p>
</div>

当我加载页面时，出现此错误：

0x800a138f - Erro de runtime de JavaScript:You Can not Get to property ' firstElementChild ' of a reference not set null OU

我该如何解决这个问题？

Answer 1

错误表示document.getElementById('textslide')未解析，意味着您的文档（DOM）未完全加载。

在执行JavaScript函数之前确保您的DOM已准备就绪：

<body>
  :
  <div id="textslide">
  <p></p>
  </div>
  <script type="text/javascript">
    // your JS code here or in the <head> element
    window.onload = loop;
  </script>
</body>

从JS代码中删除对loop的调用。

有several ways来捕获加载事件。

如果您不想使用load事件，请确保您的JavaScript代码是body元素的底部。

Answer 2

TY和看我使用的代码就是那个

<div id="textslide">
  <p></p>
  </div>
  <script type="text/javascript">
    // your JS code here or in the <head> element
        var quotes = new Array();

quotes[0] = "ola mundo";
quotes[1] = "quote2";
quotes[2] = "quote3";
quotes[3] = "quote4";
quotes[4] = "quote5";
console.log(quotes);
var counter = 0;

function loop() {
    if (counter > 4) counter = 0;
    document.getElementById('textslide').firstElementChild.innerHTML = quotes[counter];
    counter++;
    console.log(counter);
    setTimeout(loop, 2000);
}
loop();
    window.onload = loop;
    window.onload = loop;
  </script>

就像你说的那样？

我需要帮助来解决一个任务

2 个答案: