我想在每个标签下制作4个不同的页面视图，其中的信息将被动态加载。我只能加载一个标签（健康）。我看不到其他标签页的内容。我怎样做才能使每个标签页的内容显示出来？
layout.html
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="icon" href="https://cdn2.iconfinder.com/data/icons/toolix-circular/125/spatula_scraper_tool_workshop_DIY-512.png">
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
<title>Scraper</title>
</head>
<body style="background-color: black">
<ul class="nav nav-pills mb-3 justify-content-center" id="pills-tab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="pills-wellness-tab" data-toggle="pill" href="#pills-wellness" role="tab" aria-controls="pills-wellness" aria-selected="true">Wellness</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-ratemds-tab" data-toggle="pill" href="#pills-ratemds" role="tab" aria-controls="pills-ratemds" aria-selected="false">RateMDs</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-healthgrades-tab" data-toggle="pill" href="#pills-healthgrades" role="tab" aria-controls="pills-healthgrades" aria-selected="false">Healthgrades</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-gaswork-tab" data-toggle="pill" href="#pills-gaswork" role="tab" aria-controls="pills-gaswork" aria-selected="false">Gaswork</a>
</li>
</ul>
<div class="tab-content" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-wellness" role="tabpanel" aria-labelledby="pills-wellnes-tab">
{% block wellness %}{% endblock %}</div>
<div class="tab-pane fade" id="pills-ratemds" role="tabpanel" aria-labelledby="pills-ratemds-tab">
{% block ratemds %}{% endblock %}</div>
<div class="tab-pane fade" id="pills-healthgrades" role="tabpanel" aria-labelledby="pills-healthgrades-tab">
{% block healthgrades %}{% endblock %}</div>
<div class="tab-pane fade" id="pills-gaswork" role="tabpanel" aria-labelledby="pills-gaswork-tab">
{% block gaswork %}{% endblock %}</div>
</div>
</body>
</html>烧瓶应用
@app.route('/')
def home():
return render_template('wellness.html')
包括标签是有用的，包括一个模板
<div class="tab-content" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-wellness" role="tabpanel" aria-labelledby="pills-wellnes-tab">
{% include 'includes/wellness.html'%}</div>
<div class="tab-pane fade" id="pills-ratemds" role="tabpanel" aria-labelledby="pills-ratemds-tab">
{% include 'includes/ratemds.html'%}</div>
<div class="tab-pane fade" id="pills-healthgrades" role="tabpanel" aria-labelledby="pills-healthgrades-tab">
{% include 'includes/healthgrades.html'%}</div>
<div class="tab-pane fade" id="pills-gaswork" role="tabpanel" aria-labelledby="pills-gaswork-tab">
{% include 'includes/gaswork.html'%}</div>
</div>
好吧，你可以使用iframe标签，并在其中添加一点css！只要在你的div标签内使用这个标签，你就可以在其中显示你的html页面。
只要在你的div标签内使用这个标签，你就可以在你想显示html页面的地方使用这个标签
<iframe src="yourpage.html"style="border: none;" width="100%" >
这是你的 div 标签看起来像
<div class="tab-content" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-wellness" role="tabpanel" aria-labelledby="pills-wellnes-tab">
<iframe src="firstpage.html"style="border: none;" width="100%" ></iframe></div>
<div class="tab-pane fade" id="pills-ratemds" role="tabpanel" aria-labelledby="pills-ratemds-tab">
<iframe src="secondpage.html"style="border: none;" width="100%" ></iframe></div>
<div class="tab-pane fade" id="pills-healthgrades" role="tabpanel" aria-labelledby="pills-healthgrades-tab">
<iframe src="thirdpage.html"style="border: none;" width="100%" ></iframe></div>
<div class="tab-pane fade" id="pills-gaswork" role="tabpanel" aria-labelledby="pills-gaswork-tab">
<iframe src="fourthpage.html"style="border: none;" width="100%" ></iframe></div>
</div>