静态文件及模板

自学python如何成为大佬(目录):https://blog.csdn.net/weixin_67859959/article/details/139049996?spm=1001.2014.3001.5501

1  静态文件

动态Web应用也会需要静态文件,通常是CSS和JavaScript文件。Flask可以向已经配置好的Web服务器提供静态文件,只要在包或模块所在的目录中创建一个名为static的文件夹,在应用中使用 “/static”即可访问。

给静态文件生成URL,使用特殊的“static”端点名,可以应用如下代码:

url_for('static', filename='style.css')

这个文件应该存储在文件系统上的“static/style.css”中。

2  模板

模板是一个包含响应文本的文件,其中包含用占位变量表示的动态部分,其具体值只在请求的上下文中才能知道。使用真实值替换变量,再返回最终得到的响应字符串,这一过程称为渲染。为了渲染模板,Flask使用了一个名为Jinja2的强大模板引擎。

(1)渲染模板

默认情况下,Flask在程序文件夹中的templates子文件夹中寻找模板。下面通过一个实例学习如何渲染模板。

图标 (35)

  实例04  渲染模板

创建04文件夹,在该文件夹中创建templates文件夹,然后创建2个文件,分别命名为index.html和user.html。最后在04文件夹下创建render.py文件,渲染这些模板。目录结构如图11所示。

图11  目录结构

templates/index.html代码如下:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

</head>

<body>

    <h1>Hello World!</h1>

</body>

</html>

templates/user.html代码如下:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <h1>Hello, {{ name }}!</h1>

</body>

</html>

render.py代码如下:

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')

def hello_world():

    return render_template('index.html')

@app.route('/user/<username>')

def show_user_profile(username):

    # 显示该用户名的用户信息

    return render_template('user.html', name=username)

if __name__ == '__main__':

    app.run(debug=True)

Flask提供的render_template 函数把 Jinja2 模板引擎集成到了程序中。render_template函数的第一个参数是模板的文件名。随后的参数都是键值对,表示模板中变量对应的真实值。在这段代码中,第二个模板收到一个名为name的变量。上述代码中的“name=username”是关键字参数。左边的“name”表示参数名,就是模板中使用的占位符;右边的“username”是当前作用域中的变量,表示同名参数的值。

运行render.py文件,运行结果如图10和图11所示。

图10  首页

图11  获取用户信息

(2)变量

实例04在模板中使用的{{ name }}结构表示一个变量,它是一种特殊的占位符,告诉模板引擎这个位置的值从渲染模板时使用的数据中获取。Jinja2能识别所有类型的变量,甚至是一些复杂的类型,例如列表、字典和对象。在模板中使用变量的一些示例如下:

<p>从字典中取一个值: {{ mydict['key'] }}.</p>

<p>从列表中取一个值: {{ mylist[3] }}.</p>

<p>从列表中取一个带索引的值: {{ mylist[myintvar] }}.</p>

<p>从对象的方法中取一个值: {{ myobj.somemethod() }}.</p>

可以使用过滤器修改变量,过滤器名添加在变量名之后,中间使用竖线分隔。例如,下述模板以首字母大写形式显示变量name的值:

Hello, {{ name|capitalize }}

Jinja2提供的部分常用过滤器及其说明如表2所示。

表2  常用过滤器及其说明

名    称

说    明

safe

渲染值时不转义

capitalize

把值的首字母转换成大写,其他字母转换成小写

lower

把值转换成小写形式

upper

把值转换成大写形式

title

把值中每个单词的首字母都转换成大写

trim

把值的首尾空格去掉

striptags

渲染之前把值中所有的 HTML 标签都删掉

safe过滤器值需要特别说明一下。默认情况下,出于安全考虑,Jinja2 会转义所有变量。例如,一个变量的值为 '<h1>Hello</h1>' ,Jinja2 会将其渲染成'&lt;h1&gt;Hello&lt;/h1&gt;',浏览器能显示这个h1元素,但不会进行解释。很多情况下需要显示变量中存储的HTML代码,这时就可使用safe过滤器,如“{{content|safe}}”。

(3)控制结构

Jinja2提供了多种控制结构,可用来改变模板的渲染流程。本节使用简单的例子介绍其中最常用的控制结构。

下面这个例子展示了如何在模板中使用条件控制语句:

{% if user %}

Hello, {{ user }}!

{% else %}

Hello, Stranger!

{% endif %}

另一种常见需求是在模板中渲染一组元素。以下代码展示了如何使用 for 循环实现这一需求:

<ul>

{% for comment in comments %}

<li>{{ comment }}</li>

{% endfor %}

</ul>

Jinja2还支持宏,宏类似于Python代码中的函数。代码如下:

{% macro render_comment(comment) %}

<li>{{ comment }}</li>

{% endmacro %}

<ul>

{% for comment in comments %}

{{ render_comment(comment) }}

{% endfor %}

</ul>

为了重复使用宏,我们可以将其保存在单独的文件中,然后在需要使用的模板中导入如下代码:

{% import 'macros.html' as macros %}

<ul>

{% for comment in comments %}

{{ macros.render_comment(comment) }}

{% endfor %}

</ul>

需要在多处重复使用的模板代码片段可以写入单独的文件,再包含在所有模板中,以避免重复:

{% include 'common.html' %}

另一种重复使用代码的强大方式是模板继承,它类似于 Python 代码中的类继承。首先,创建一个名为base.html的基模板:

<html>

<head>

{% block head %}

<title>{% block title %}{% endblock %} - My Application</title>

{% endblock %}

</head>

<body>

{% block body %}

{% endblock %}

</body>

</html>

block标签定义的元素可在衍生模板中修改。在本实例中,我们定义了名为head、title和body的块。注意,title包含在head中。下面这个示例是基模板的衍生模板:

{% extends "base.html" %}

{% block title %}Index{% endblock %}

{% block head %}

{{ super() }}

<style>

</style>

{% endblock %}

{% block body %}

<h1>Hello, World!</h1>

{% endblock %}

extends指令声明这个模板衍生自base.html。在extends指令之后,基模板中的3个块被重新定义,模板引擎会将其插入适当的位置。注意新定义的head块,在基模板中其内容不是空的,所以使用super()获取原来的内容。

  • 33
    点赞
  • 20
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
### 回答1: 纯静态HTML网页模板是一种简单而基础的网页模板。它由纯HTML代码构成,不包含任何动态元素或后端的交互。这种模板适用于简单的静态网页,无需后台服务器的支持。 纯静态HTML网页模板的特点是简洁、轻巧,加载速度快,不需要复杂的技术知识即可创建和维护。它通常包含一个基本的网页结构,包括头部、主体和底部,并使用CSS样式来美化页面的外观。 使用纯静态HTML网页模板,你可以自由编辑HTML代码,添加文本、图片、链接和其他元素来呈现你想要的内容。可以根据需要自定义样式,通过CSS来调整网页的布局和外观。同时,还可以使用JavaScript来增加一些交互效果,如鼠标滚动动画、轮播图等。 纯静态HTML网页模板的最大缺点是无法实现动态内容的展示和交互。它无法处理用户的输入或向服务器发送请求,也无法根据用户的操作动态更新内容。因此,若网站需要有动态交互的功能,比如用户注册、登录和数据交互等,纯静态HTML网页模板就不再适用。 总的来说,纯静态HTML网页模板是一种简单而基础的网页模板,适用于无需后端支持的简单静态网页。它具有简洁、轻巧和快速加载的特点,但无法实现动态内容和交互功能。 ### 回答2: 纯静态HTML网页模板是一种仅包含HTML文件的网页模板,没有任何动态的服务器端脚本或数据库查询。这种模板适用于小型网站或只需要展示固定内容的网页。以下是关于纯静态HTML网页模板的一些特点: 1. 网页内容静态不变:纯静态HTML模板没有动态生成的内容,每次访问网页时都会呈现相同的内容。这意味着网页的内容不会随着用户的操作而改变。 2. 页面加载速度快:因为纯静态HTML网页没有服务器端脚本或数据库查询,所以它们的加载速度较快。所有的内容都保存在HTML文件中,不需要进行后台的数据处理。 3. 易于维护和部署:由于没有服务器端脚本的应用,纯静态HTML网页模板的维护和部署工作相对较简单。只需要将HTML文件上传到服务器上即可,不需要额外的配置或安装。 4. 不适合复杂功能:纯静态HTML网页模板无法实现复杂的交互功能,例如用户登录、评论系统或购物车等。这些功能通常需要服务器端的脚本来处理用户的输入和逻辑操作。 5. 不易于更新:由于没有后台,纯静态HTML网页模板的更新必须手动进行。每次需要修改网页内容时,都需要编辑HTML文件并重新上传到服务器上。 总结来说,纯静态HTML网页模板适合于较小规模的网站或只需要展示静态内容的页面。它们加载速度快,易于维护和部署,但无法实现复杂的交互功能,需要手动更新网页内容。 ### 回答3: 纯静态html网页模板指的是没有使用服务器端脚本语言(如PHP、Node.js等)和数据库的网页模板。它主要由HTML、CSS和JavaScript组成。 首先,HTML是用于结构化网页内容的标记语言。通过使用HTML标签,我们可以定义网页的基本结构,如标题、段落、图像、链接等。纯静态HTML网页模板主要是通过嵌入静态HTML代码来展示网页内容。 其次,CSS(层叠样式表)用于控制网页的样式和布局。通过CSS,我们可以定义网页的颜色、字体、边距、背景等外观效果。在纯静态HTML网页模板中,CSS通常被嵌入在HTML文件的"style"标签中,或者可以链接到外部CSS文件。 最后,JavaScript是一种用于增加交互性和动态效果的脚本语言。通过JavaScript,我们可以实现网页的一些动态功能,如表单验证、菜单切换、图片轮播等。纯静态HTML网页模板通常会使用JavaScript来实现这些简单的交互效果。 纯静态HTML网页模板适合于简单的静态网站或者展示性的网页。它的优点是加载速度快,兼容性好,不受服务器端脚本语言数据库的限制。然而,由于它缺乏动态性和交互性,无法处理用户的输入和查询等复杂功能。 总之,纯静态HTML网页模板是一种简单、高效的网页创建方式,适用于展示性的网页内容。通过合理使用HTML、CSS和JavaScript,我们可以创建出美观、功能简单的静态网页。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

橙子味冰可乐

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值