python flask html 需要帮助

两个for loop, inner for loop 我只想让他print 一次但是由于imageList 是str 格式不能互相兼容
from distutils.log import debug
import flask
import os

app = flask.Flask(__name__)

picFolder = os.path.join('static','pictures')


@app.route("/")
def index():
    tvshow = ["House of Cards","Peaky Blinders","Prison Break",
            "Breaking Bad","Stranger Things"]
    Most = ["House of Cards"]

    imageList = os.listdir('/static/pictures')
    imageList = ['pictures/'+ image for image in imageList]
    
    return flask.render_template("index.html", len = len(tvshow), 
    tvshow = tvshow, Most = Most, imageList = imageList, len1=len(imageList))

app.run(debug=True)

<html> 
    <head>
        <link rel="stylesheet" href="/static/style.css"/>
    </head>

    <body>
        <h1>Hello World<br>
        's favorite TV shows are: {{tvshow[:3]}}.</h1>
        <style scoped>
                .greenTex**t {color:green;}
                </style>
        <ol>
          _   {%for imageList in imageList %}   

               {%for i in range(0, len5)%}**

                    {% if Most[0] == tvshow[i] %}_
                        <li class="greenText">{{tvshow[i]}}</li>     
                        <img src = "{{url_for('static', filename = imageList)}}"width="300" height="300">
                        
                     {% else %}
                        <li>{{tvshow[i]}}</li> 
                        <img src = "{{url_for('static', filename = imageList)}}"width="300" height="300">
                    {% endif %}  
                 {%endfor%}
            {%endfor%}
        </ol>
        
        
       
    </body>


</html>


问题相关代码,请勿粘贴截图
运行结果及报错内容

img

我的解答思路和尝试过的方法
我想要达到的结果

img

题主思路有问题吧。确认imageList数组图片出现的循序和tvshow的一致?如果不一致图片就会和剧名不一致了。

如果确认一致,可以用in操作符判断遍历到的tvshow项是否在Most里面,在就加上greenText样式,改成下面这样

img

<html> 
    <head>
        <link rel="stylesheet" href="/static/style.css"/>
    </head>
 
    <body>
        <h1>Hello World<br>
        's favorite TV shows are: {{tvshow[:3]}}.</h1>
        <style scoped>
                .greenText {color:green;}
                </style>
        <ol>
           {%for i in range(0, len1) %}
              {% if tvshow[i] in Most %}
                 <li class="greenText">{{tvshow[i]}}</li>     
                 <img src = "{{url_for('static', filename = imageList[i])}}"width="300" height="300">
                        
              {% else %}
                 <li>{{tvshow[i]}}</li> 
                 <img src = "{{url_for('static', filename = imageList[i])}}"width="300" height="300">
              {% endif %}  
            {%endfor%}
        </ol>
        
        
       
    </body>
 
 
</html>
 


img