Question

<script language="javascript">
 var slideIndex = 0;
 showSlides();

 function plusSlides(n) {
  showSlides(slideIndex += n);
 }

 function currentSlide(n) {
  showSlides(slideIndex = n);
 }

 function showSlides() {
    var i;
    //var slides = document.getElementsByClassName("mySlides");
    var slides = document.getElementsByClassName("col", "div", document.getElementById("mySlides"));
    for (i = 0; i < slides.length; i++) {
        slides[i].style.display = "none"; 
    }
    slideIndex++;
    if (slideIndex> slides.length) {slideIndex = 1} 
       slides[slideIndex-1].style.display = "block";
    setTimeout(showSlides, 2000); // Change image every 2 seconds
 }
</script>

我已经在我的HTML中编写了这个javascript，它可以正常使用它。但是当我把它作为hta文件运行时，

它会引发错误＆＃34;无法获得＆＃39; style＆＃39;未定义或空引用当覆盖style.display财产＆＃34;在线

"slides[slideIndex-1].style.display = "block";"

但它没有在行

处抛出错误

slides[i].style.display = "none";

Answer 1

我在这里看到了一些有趣的事情：

1）看起来您正在将应用程序逻辑（HTML）与行为逻辑（JavaScript）混合在一起。您应该考虑将此JS代码放入一个文件中，并将<script type="text/javascript" src="filename.js"></script>调用它放在</body>标记的正上方。这将在页面加载后运行代码，因此元素将在脚本运行之前呈现。如果当前脚本位于使用id=mySlides呈现元素的代码之上，则可能返回undefined。这样做可以使您的代码更加模块化，更易于阅读和维护。

2）我之前从未见过这种语法：document.getElementsByClassName("col", "div", document.getElementById("mySlides"));。我会认为这是非常可疑的，因为我在https://developer.mozilla.org/en/docs/Web/API/Document/getElementsByClassName没有看到任何提及它。我建议在那里重构代码。将其更改为document.querySelectorAll('.col, .div, #mySlides')（假设您有一个名为div的类。如果您要查找所有<div>标记，请删除句点。

3）如果您看到undefined，则slides.length可能为0，在我看来，它可能与您的getElementById用法有关。请尝试在var slides =部分console.log("Number of elements found: " + slides.length);

下方添加此内容

无法获得＆＃39; style＆＃39;覆盖style.display属性时的undefined或null引用

1 个答案: