如何用BeautifulSoup从单个div中提取多个文本元素并在Flask模板中正确展示？

嗨，我来帮你解决这个问题！你遇到的核心问题是没把每个职位的标题和对应描述绑定在一起，而且循环写法有误——jobs是BeautifulSoup返回的ResultSet对象，不能像函数那样调用它。下面是具体的解决步骤：

第一步：修正Python代码逻辑 #

我们要遍历每个职位卡片（card-job），在每个卡片内部单独提取标题和描述，这样能保证标题和描述绝对一一对应。具体代码如下：

from bs4 import BeautifulSoup
from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def home():
    # 假设source是你获取到的网页源码
    soup = BeautifulSoup(source, 'lxml')
    # 获取所有职位卡片容器
    job_cards = soup.find_all("div", {"class": "card-job"})
    
    jobs_list = []
    for card in job_cards:
        # 在当前卡片内提取职位标题
        title_tag = card.find("h2", {"class": "card-title"})
        job_title = title_tag.get_text(strip=True) if title_tag else "无职位标题"
        
        # 在当前卡片内提取职位描述（job-meta下的所有列表项）
        meta_items = card.find("ul", {"class": "job-meta"}).find_all("li")
        # 把多个列表项拼接成一个字符串，也可以保留列表形式
        job_description = " | ".join([item.get_text(strip=True) for item in meta_items])
        
        # 将当前职位的标题和描述存入字典，再添加到列表中
        jobs_list.append({
            "title": job_title,
            "description": job_description
        })
    
    # 把包含配对信息的列表传给模板
    return render_template('home.html', jobs=jobs_list)

第二步：修改Flask模板展示逻辑 #

现在jobs是一个字典列表，每个字典都包含对应职位的title和description，模板里可以这样遍历展示：

<div class="jobs">
    {% for job in jobs %}
        <div class="job-item">
            <h3>{{ job.title }}</h3>
            <p>{{ job.description }}</p>
        </div>
    {% endfor %}
</div>

为什么你的原代码出错？ #

你写的jobs(soup.find_all(...), ...)是错误的，因为soup.find_all("div", {"class": "card-job"})返回的是ResultSet（类似列表的对象），它不是函数，不能用括号调用。而且这种强行把所有标题和所有描述配对的方式，虽然现在页面结构顺序对应，但一旦页面有变动（比如某个卡片缺失元素），就会出现标题和描述错位的问题——而我们在每个卡片内部提取的方法，完全避免了这个风险。

备注：内容来源于stack exchange，提问作者hemoglobin