使用 javascript 使用 FOR OF 数组循环时出错？

Question

在这里，为什么我的代码不能在 IE 中运行。 我的代码适用于所有浏览器。没有问题。 但是当我在 IE 上运行我的项目时，它发现错误。

还有我的 jquery 类和 insertadjacentHTMl 不工作。

我在这段代码中发现的主要问题。

$("[type=slideshow] section").addClass('hide');
		for(let ele of Array.from($("[type=slideshow]"))){
			$(ele).children("section:first").removeClass("hide").addClass('active');
		}

这里是我的代码，请查看错误在哪里。

//Code for Slideshow

var divSlide = document.querySelectorAll('#slide');

var myNodeList = divSlide.length;
let slideNo = 1;

for(var i = 0; i < myNodeList; i++) {
	var type = divSlide[i].getAttribute("type");
	if (type == "timeline") {

	} else if (type == "slideshow") {
		var timeline = divSlide[i];     
		let sliderData = timeline.getElementsByTagName("section");
		
		$("[type=slideshow] section").addClass('hide');
		for(let ele of Array.from($("[type=slideshow]"))){
			$(ele).children("section:first").removeClass("hide").addClass('active');
		}

		timeline.insertAdjacentHTML("afterbegin",'<a class="left prev color_arrow carousel-control" href="#myCarousel" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span><span class="sr-only">Previous</span></a>');

		timeline.insertAdjacentHTML('afterbegin','<a class="right next color_arrows  carousel-control" href="#myCarousel"  data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span><span class="sr-only">Next</span></a>');
	}
}

$(document).on ('click','.prev',function() {
	let select = $(this).parent();
	let totChild = select.children("section");
	for(let i=0;i<totChild.length;i++){
		if(totChild[i].getAttribute('class').indexOf('active')!=-1){
			slideNo=i+1;
		}
	}
	totChild.children('br').remove();
	let current = select.children('.active');
	let prevEl = current.prev('section');
	
	if(slideNo === totChild.length || slideNo > 1){
		select.children(".next").show();
		if(prevEl.length !== 1){
			prevEl = current.prev().prev();
			current.removeClass('active');
			current.addClass('hide');

			prevEl.addClass('active');
			prevEl.addClass('animated');
			prevEl.addClass('fadeInLeft');
			prevEl.removeClass('hide');
		}
	} else {
		select.children(".prev").hide();
	}
});
$(document).on ('click','.next',function() {
	let select = $(this).parent();
	let totChild = select.children("section");
	for(let i=0;i<totChild.length;i++){
		if(totChild[i].getAttribute('class').indexOf('active')!=-1){
			slideNo=i+1;
		}
	}
	
	totChild.children('br').remove();
	let current = select.children('.active');
	let prevEl = current.next('section');
	if(slideNo ===1 || slideNo < totChild.length){
		
		select.children(".prev").show();
		if(prevEl.length !== 1){
			prevEl = current.next().next();
			current.removeClass('active');
			current.addClass('hide');
			prevEl.addClass('animated');
			prevEl.addClass('fadeInRight');
			prevEl.addClass('active');
			prevEl.removeClass('hide');
		}
	} else {
		select.children(".next").hide();
	}
});

Answer 1

for-of 不受IE 支持。您可以将 for-of-loop 替换为 jquery 的 each

$("[type=slideshow] section").addClass('hide');
$("[type=slideshow]").each( function(i,ele){ //i is the index and ele is the element in iteration
   $(ele).children("section:first").removeClass("hide").addClass('active');
});

另外，无需将 jquery 与 javascript 混合 querySelector 并使用 for-loop 循环结果。

当使用基于 # 的选择器 #slide 时

var divSlide = document.querySelectorAll('#slide');

它只会给出一个结果，只需使用

timeline = $( "#slide" )[0];

不需要外部for-loop和if-condition。