英文:
Changing a html class after the first item in a Hugo loop
问题
所以我正在使用Bootstrap和Hugo制作一个评论轮播图,我有一段代码,可以分解成这样:
{{ range seq 1 3 (len site.Data.reviews) }}
...
{{ range seq . (add . 2) }}
{{ with (index site.Data.reviews (string .)) }}
{{ .des }}
{{ end }}
{{ end }}
...
{{ end }}
所以有两个循环,一个用于创建轮播图的幻灯片,另一个用于填充幻灯片的数据文件。问题是,我需要删除活动类并调整下几个幻灯片上的data-bs-interval输入。我考虑过使用if语句,但不确定如何替换第一个div,以便在生成的内容中不再具有活动类。
英文:
So I am making a review carousel using Bootstrap and Hugo, I've got code that breaks down into this:
{{ range seq 1 3 (len site.Data.reviews) }}
...
{{ range seq . (add . 2) }}
{{ with (index site.Data.reviews (string .)) }}
{{ .des }}
{{ end }}
{{ end }}
...
{{ end }}
So there's two loops, one to make the slides for the carousel, and the other to fill the slides with data files. The issue is I need to delete the active class and adjust the data-bs-interval input on the next few slides I thought about making an if statement but I'm not sure how to replace the first div with one that doesn't have the active class after that in whats generated.
答案1
得分: 1
我不知道这是否是最好的解决方案,但是我没有修改循环,而是写了一段JavaScript代码:
var addActive = document.getElementById('carouselExampleDark').getElementsByClassName('carousel-item')[0];
addActive.classList.add("active");
这对我的用例有效,所以我就这样留下了。
英文:
I don't know if this is the best solution to it, instead of editing the loop I wrote a bit of javascript:
var addActive = document.getElementById('carouselExampleDark').getElementsByClassName('carousel-item')[0];
addActive.classList.add("active");
That works for my use case so I'll leave it at that.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论