Html Jinja2批处理过滤器-如何获取各种div元素的文本

使用flask&bootstrap 4，我使用批处理过滤器为每3个项目创建一个新行，如下所示

{% for row in teams|batch(3) %}
    <div class="row">
        {% for value,participant in row %}
            <div class="col stackem mb-2">
            <div class="text-center" id="participant">{{ participant }}</div>
            <div class="text-center mb-2"><button type="button" class="btn btn-secondary btn-sm custom" data-toggle="modal" data-target="#MyModal" id ='{{ loop.index }}'>{{ value }}</button></div>
            </div>
        {% endfor %}
    </div>
{% endfor %}

问题是，无论我点击哪个分区，我总是只得到列表中的第一个参与者。。。我试图通过使id类似于按钮来引用循环

id ='{{ loop.index }}'

---

但由于批处理过滤器，我仍然只得到1、2或3作为值。我怎样才能获得不同参与者的文本？我想我必须参考团队（因为它包含所有参与者），但我不知道如何获取团队中每个元素的索引/位置，因为批处理筛选器只给我1、2或3？？？。

您的

参与者ID应该是唯一的。试试这个：

{% for row in teams|batch(3) %}
    <div class="row">
        {% for value,participant in row %}
            <div class="col stackem mb-2">
            <div class="text-center" id="participant-{{loop.index}}">{{ participant }}</div>
            <div class="text-center mb-2"><button type="button" class="btn btn-secondary btn-sm custom" data-toggle="modal" data-target="#MyModal" id ='{{ loop.index }}'>{{ value }}</button></div>
            </div>
        {% endfor %}
    </div>
{% endfor %}

{团队中行的百分比|批次（3）%}
{值为%，第%]行中的参与者}
{{参与者}
{{value}}
{%endfor%}
{%endfor%}

如果您想抓取所有参与者，您可能需要使用
document.getElementsByClassName
并将
participant
添加到您的类属性中。
感谢@afro提供反馈。我使ID唯一，但我是否更新
participant=document.getElementById（“participant”）.textContent因为现在我得到了未捕获的TypeError:无法读取该行的null属性“textContent”…现在没有
参与者
ID，所以您正在对null对象调用
textContent
。如果您试图在单击
按钮
元素时获取
参与者
的值，那么将该数据附加到按钮可能会更容易，但如果没有更多上下文，我无法判断。
{% for row in teams|batch(3) %}
    <div class="row">
        {% for value,participant in row %}
            <div class="col stackem mb-2">
            <div class="text-center" id="participant-{{loop.index}}">{{ participant }}</div>
            <div class="text-center mb-2"><button type="button" class="btn btn-secondary btn-sm custom" data-toggle="modal" data-target="#MyModal" id ='{{ loop.index }}'>{{ value }}</button></div>
            </div>
        {% endfor %}
    </div>
{% endfor %}