django-web系统模板

不念不忘少年蓝@ 2022-02-26 03:20 246阅读 0赞

# 1.采用Django web模板的原因： #

（1）要求变量和HTML尽量分开

（2）HTML和 python要分开

# 2.创建是的基本思路： #

首先：要确定表达的形式

加载模板

From django.template import Template

Template(string)

其次：要确定表达的内容

封装数据

From django.template import Template

Context(data)

最后：表达的形式加载表达的内容

template.render(context(data))

完整代码
 from django.template import Template,Context
 
 def invite(request,name):
 template = Template(
 """
 谨定于 {
 { year }} 年 {
 { month }} 月 {
 { day }} 日: 
 农历 {
 { calendar }} 为 {
 { groom }} {
 { birde }} 举办 婚礼，略备薄酒，恭候 {
 { sir }} 光临{
 { hotel }}. 
 地址:{
 { address }} 
 敬约 恕邀 
 时间: 下午{
 { time }} 恭候 
 """
 )
 data = Context({
 "year":"2019",
 "month":"3",
 "day":"28",
 "calendar":"腊月初五",
 "groom":"喜洋洋",
 "birde":"暖洋洋",
 "sir":name,
 "hotel":"羊村大酒店",
 "address":"青青草原羊村路48羊村大酒店三楼",
 "time":"六时整",
 })
 result = template.render(data)
 return HttpResponse(result)

# 3.Django 模板标签语言 #

## （1）变量 ##

\{ \{变量\}\}

1.传去前端的变量最外层一定是一个字典

2.具体的变量可以是字符串、列表、字典类型

3.变量可以通过 “ ·”方法调用自己的无参数的方法、索引

4、如果变量是字典也可同过键调用值

案例：

def variable(request):
 """
 变量案例
 """
 tem = Template(
 """
 
 变量常规用法:{
 { variable }}
 
 
 变量常规用法_变量列表:{
 { variable1 }}
 
 
 变量常规用法_变量索引:{
 { variable1.1 }}
 
 
 变量常规用法_变量无参数方法:{
 { variable2.upper }}
 
 
 变量常规用法_变量字典:{
 { variable3 }}
 
 
 变量常规用法_变量字典键取值:{
 { variable3.name }}
 
 """
 )
 data = Context({
 "variable": "老边",
 "variable1": [1,2,3,4],
 "variable2": "laobian",
 "variable3": {"name":"老边","age":18},
 })
 result = tem.render(data)
 return HttpResponse(result)

## （2）标签 ##

###         \{ %if% \}标签： ###

1、 双标签判断结束：\{%if%\}\{%endif%\}

2、\{%if%\} 通常判断一个变量是否存在或者是否为真，判断指定的条件True或False

3、\{%if%\}标签可以有\{%elif%\} 和\{%else%\}

案例：

def label_if(request):
 """
 if 标签
 """
 tem = Template(
 """
 {% if username %}
 欢迎登陆 {
 { username }} 
 {% else %}
 
 <a href="#">
 请登陆
 </a>
 
 {% endif %} 
 """
 )
 data = Context({
 "username": "老边",
 })
 result = tem.render(data)
 return HttpResponse(result)

###        \{%ifequal %\}标签 ###

1、判断两个量是否相等，通常用于比较

2、双标签判断结束：\{%ifequal%\}\{%endifequal%\}

3、 \{%ifequal%\}也可以有\{%else%\}

\{%for%\}标签

双标签判断结束：\{%for%\}\{%endfor%\}

\{%for%\}采用了和Python一样的\{% for i in range%\}结构遍历

for 循环出来的不是HTML对象，只是数据

案例

def label_ifequal(request):
 """
 ifequal 标签
 """
 tem = Template(
 """
 {% ifequal gender "M" %}
 欢迎登陆 {
 { username }} 先生 
 {% else %}
 欢迎登陆 {
 { username }} 女士 
 {% endifequal %} 
 """
 )
 data = Context({
 "username": "老边",
 "gender": "W"
 })
 result = tem.render(data)
 return HttpResponse(result)

###        \{% for %\} ###

1、\{% for %\} 标签需要 \{% endfor %\} 标签进行闭合

2、\{% for %\} 标签采用了和python一样的for in结构。

3、\{% for %\} 循环出来的不是html对象只是数据

案例：

def label_for(request):
 """
 ifequal 标签
 """
 tem = Template(
 """
 <table>
 <tr>
 <th>
 标题
 </th>
 <th>
 作者
 </th>
 <th>
 类型
 </th>
 <th>
 封面
 </th>
 </tr>
 {% for article in articles %}
 <tr>
 <td>
 {
 { article.title }}
 </td>
 <td>
 {
 { article.author }}
 </td>
 <td>
 {
 { article.type }}
 </td>
 <td>
 <img style = "width:100px;height:100px;" src="{
 { article.picture }}">
 </td>
 </tr>
 {% endfor %}
 </table> 
 """
 )
 data = Context({
 "articles": [
 {"title": "背影","author": "朱自清","type": "散文", "picture":"https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1553750586542&di=18fa022c5ec799d65558c2bf299d0023&imgtype=0&src=http%3A%2F%2Fimg3.duitang.com%2Fuploads%2Fitem%2F201507%2F05%2F20150705135641_K4sVA.jpeg"},
 {"title": "诛仙", "author": "萧鼎", "type": "小说", "picture": "https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=328549116,1379468112&fm=26&gp=0.jpg"},
 {"title": "西游记", "author": "吴承恩", "type": "小说","picture": "https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=4100856954,312579948&fm=26&gp=0.jpg"},
 {"title": "鲁宾逊漂流记", "author": "丹尼尔·笛福", "type": "小说", "picture": "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1553750785199&di=d906d54cf8456736d285b99f601bb968&imgtype=jpg&src=http%3A%2F%2Fimg4.imgtn.bdimg.com%2Fit%2Fu%3D1665326279%2C2802541090%26fm%3D214%26gp%3D0.jpg"},
 {"title": "活着", "author": "余华", "type": "小说", "picture": "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1553750868172&di=ccae9a343204f59cecbcc21c9e811e58&imgtype=0&src=http%3A%2F%2Fs1.sinaimg.cn%2Flarge%2F001Pe7mxzy76VARpXvdc3"},
 ],
 })
 result = tem.render(data)
 return HttpResponse(result)

###         \{ \{forloop\}\}标签 ###

1、 Django模板定义好的一个遍历，用来表示循环中的每次循环

2、 forloop为甜头循环提供parentloop参数来记录当前循环的上一层情况

3、  通常我们使用forloop标签进行循环的开头或者结尾

案例：

def label_forloop(request):
 """
 forloop 教学版
 """
 tem = Template(
 """
 <h3>单层循环</h3>
 <ul>
 {% for i in range %}
 {% for title in articles %}
 <li>
 {
 { title }} 是第 {
 { forloop.counter }} 次循环 他的父循环是第 {
 { forloop.parentloop.counter }} 次循环
 </li>
 {% endfor %}
 {% if not forloop.last %}
 ============================================================= 
 {% endif %}
 
 {% endfor %}
 """
 )
 data = Context({
 "articles": ["背影", "诛仙", "西游记", "鲁宾逊漂流记", "活着"],
 "range": "abc"
 })
 result = tem.render(data)
 return HttpResponse(result)

## （3）过滤器 ##

\{ \{  |  \}\}

Safe 去掉前端转义

对变量进行具体功能的处理，比如转义、大写、小写等

\{ \{  argv   |  safe  \}\}去掉前端转义

\{ \{  argv| upper \}\}     全部大写

def filter(request):
 template = Template(
 """
 {
 { argv|safe }}
 """
 )
 context = Context(
 {"argv": "<img src='https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1553764577707&di=8606cc4a988ec1bc8e6b3924fdfa8790&imgtype=0&src=http%3A%2F%2Ftc.sinaimg.cn%2Fmaxwidth.2048%2Ftc.service.weibo.com%2Finews_gtimg_com%2F0fcdfe79cf544cf40f75f5d15511a159.jpg'>"}
 )
 result = template.render(context)
 return HttpResponse(result)

# 4.Django当做独立的系统模板 #

## （1）创建模板目录 ##

![20190328193844377.png][]

## （2）添加模板路径 ##

在settings.py设置文件下添加模板路径

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDIzOTQ1NA_size_16_color_FFFFFF_t_70][]

## （3）加载使用模板 ##

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDIzOTQ1NA_size_16_color_FFFFFF_t_70 1][]

5.超链接

/ 出现在HTML标签的路径中表示分割路径，如果出现在开头表示根，否则从当前开始连接

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDIzOTQ1NA_size_16_color_FFFFFF_t_70 2][]

[20190328193844377.png]: /images/20220226/89b95348fff84c708018794c9d29e71f.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDIzOTQ1NA_size_16_color_FFFFFF_t_70]: /images/20220226/1894827c84384a03a830f77b9dd7f35d.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDIzOTQ1NA_size_16_color_FFFFFF_t_70 1]: /images/20220226/e304d43ba18f47299838944243c89411.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDIzOTQ1NA_size_16_color_FFFFFF_t_70 2]: /images/20220226/e4316ff6733446ef8f1a6783ac686016.png