я получаю «Uncaught TypeError: не могу прочитать свойство« стиль »неопределенного» в строке 12, я не знаю, почему
class Slider {
duration = 0;
currentSlide = 0;
slides = document.getElementsByClassName("slide");
constructor() {
this.initSlide();
}
initSlide() {
var i;
for (i = 0; i < this.slides.length; i++) {
this.currentSlide[i].style.display = "none";
}
this.currentSlide++;
if (this.currentSlide > this.slides.length) {
this.currentSlide = 1
}
this.slides[this.currentSlide - 1].style.display = "block";
setTimeout(this.initSlide, 3000);
}
}
Внутри вашего initSlide
-метода вы пытаетесь перебрать список элементов, которые имеют имя класса slide
.
Внутри вашего цикла вы используете this.currentSlide
в качестве массива и предполагаете, что элемент массива является элементом html, который имеет стиль свойства. Но вы объявили свойство currentSlide как тип числа и присвоили значение 0. Вы не можете перебирать 0 или числовой тип.
Правильная итерация должна быть:
for (i = 0; i < this.slides.length; i++) {
this.slides[i].style.display = "none";
}
Но я думаю, это не то, что вы хотели, верно, но это решает вашу ошибку.
Обновлено: Чтобы избежать всех следующих ошибок, вы должны сначала проверить, есть ли слайды на странице:
if(this.slides.length >= 1) {
this.slides[this.currentSlide - 1].style.display = "block";
}
И используйте функцию стрелки, а не саму функцию, чтобы ваша внутренняя ссылка this не указывала на объект окна, вместо того, чтобы указывать на ваш сгенерированный объект.
setTimeout(() => this.initSlide(), 3000);
@iceson Чтобы избежать всех последующих и возможных ошибок, смотрите мое редактирование.
Большое спасибо, что нашли время, чтобы объяснить мне. карусель работает.
@iceson Можете ли вы тогда отметить мой ответ как решение? Или это было другое, что помогло вам?
да, спасибо, но теперь у меня такая же проблема с длиной в предыдущей строке, извините, я только начал изучать javascript 3 недели назад, я просто пытаюсь понять.