zoukankan      html  css  js  c++  java
  • Django学习之

    模板语言if/else/endif

    {% if today_is_weekend %}
        <p>Welcome to the weekend!</p>
    {% else %}
        <p>Get back to work.</p>
    {% endif %}

    解释:当变量:today_is_weekend 为真,返回:<p>Welcome to the weekend!</p> ,否则返回:<p>Get back to work.</p>

    模板语言循环
    1:如果模板语言遇到列表,直接进行循环取值即可。
    2:如果模板语言遇到字典进行循环有以下3种:
      - for item in dict.keys 只循环获取字典key
      - for item in dict.value 只循环获取字典value
      - for k,v in dict.items 循环获取字典的key,value全部。
    实例url:fordict # 字典for循环的取值方法

    1 userlist = {
    2     '1': {'name': 'jack', 'age': 36},
    3     '2': {'name': 'anna', 'age': 26},
    4     '3': {'name': 'vivi', 'age': 16},
    5 }
    6 def fordict(request):
    7     return render(request,'dict_for.html',{'ulist':userlist})
    View Code
     1 <!DOCTYPE html>
     2 <html lang="en">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>循环字典</title>
     6 </head>
     7 <body>
     8 <div>
     9     {% for k in ulist.keys %}
    10     <div>字典key:{{ k }}</div>
    11     {% endfor %}
    12     <hr />
    13     {% for v in ulist.values %}
    14     <div>字典value:{{ v }}</div>
    15         {% for k1,v1 in v.items %}
    16             <div>字典k - v: {{ k1 }} -- {{ v1 }}</div>
    17         {% endfor %}
    18     {% endfor %}
    19     <hr />
    20     {% for k,v in ulist.items %}
    21     <div>字典k - v:{{ k }} - {{ v }}</div>
    22     {% endfor %}
    23 <hr />
    24 <hr />
    25     {% for k,v in ulist.items %}
    26 {#    <div><a href="/detail?nid={{ k }}">{{ v.name }}</a></div>#}
    27     <div><a href="/detail-{{ k }}.html">{{ v.name }}</a></div>
    28     {% endfor %}
    29 </div>
    30 </body>
    31 </html>
    HTML

    实例url:detail # 查看详情

     1 url写法
     2     # url(r'^detail',views.detail),
     3     # url(r'^detail-(d+).html',views.detail), # 正则写法
     4     url(r'^detail-(?P<nid>d+).html',views.detail), # 正则分组写法
     5 
     6 视图函数
     7 def detail(request,nid):
     8     # nid = request.GET.get('nid')
     9     curr_info = userlist[nid]
    10     return render(request,'detail.html',{'detail_info':curr_info})
    View Code
     1 <!DOCTYPE html>
     2 <html lang="en">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>详细信息</title>
     6 </head>
     7 <body>
     8     <form action="/index" method="post">
     9         <input type="text" name="user" placeholder="用户名" />
    10         <input type="text" name="email" placeholder="email" />
    11         <input type="submit" value="提交" />
    12     </form>
    13     <ul>
    14         {% for k,v in detail_info.items %}
    15             <li>{{ k }} -- {{ v }}</li>
    16         {% endfor %}
    17     </ul>
    18 </body>
    19 </html>
    HTML

    使用:reversed 对列表进行反向迭代

    {% for athlete in athlete_list reversed %}
    ...
    {% endfor %}

    使用:{% empty %} 的可选参数检测列表是否为空

    {% for athlete in athlete_list %}
        <p>{{ athlete.name }}</p>
    {% empty %}
        <p>There are no athletes. Only computer programmers.</p>
    {% endfor %}

    以下为 for 循环里 forloop模板变量的个别使用和属性说明:

    说明:forloop的变量只能在for循环引用。

    forloop.counter:当前循环的执行次数的整数计数器,默认从1开始。

    {% for item in todo_list %}
        <p>{{ forloop.counter }}: {{ item }}</p>
    {% endfor %}
    

     forloop.counter0:当前循环的执行次数从 0 开始计数。

    forloop.revcounter :初始执行计数为序列数的总数,最后一次循环计数为1,也就是counter的逆序。

    forloop.revcounter0 :功能同上,不同点是列数总数减1.

    forloop.first:是一个布尔值,迭代第一次执行置为空

    {% for object in objects %}
        {% if forloop.first %}<li class="first">{% else %}<li>{% endif %}
        {{ object }}
        </li>
    {% endfor %}
    

    forloop.last:是一个布尔值,循环最后一次执行置为:True,常见用法是一系列链接之间放置管道符。如下:

    {% for link in links %}{{ link }}{% if not forloop.last %} | {% endif %}{% endfor %}
    输入: Link1 | Link2 | Link3 | Link4 这里无管道符

    forloop.parentloop :是一个指向当前循环的上一级循环对象的引用。

    {% for country in countries %}
        <table>
        {% for city in country.city_list %}
            <tr>
            <td>Country #{{ forloop.parentloop.counter }}</td> # 循环的上一级
            <td>City #{{ forloop.counter }}</td>
            <td>{{ city }}</td>
            </tr>
        {% endfor %}
        </table>
    {% endfor %}
    

    ifequal / ifnotequal

    ifequal:比较2个值,如果相等,则显示{% ifequal%} 和 {% endifequal%} 之间的数据。可选标签{% else %}实例如下:

    比较2个模板变量:user , currentuser 

    {% ifequal user currentuser %}
        <h1>Welcome!</h1>
    {% endifequal %}

    注意:ifequal 只支持模板变量,字符串,整数,小数, 其他类型不支持。

    过滤器:在模板变量被显示前修改它的值的一个简单方法,使用管道符:( | )

    如:{{ name|lower }} :变量name的值被过滤器处理后,显示的值转换为小写。

    过滤器参数:跟随冒号之后并用双引号包含,如:{{ bio|truncatewords:"30" }}: 显示变量bio 的前30个字符

    重要的过滤器:

    addslashes : 添加反斜杠到任何反斜杠、单引号或者双引号前面。 这在处理包含JavaScript的文本时是非常有用的。

    date : 按指定的格式字符串参数格式化 date 或者 datetime 对象, 如:{{ pub_date|date:"F j, Y" }}

    length : 返回变量的长度。 对于列表,这个参数将返回列表元素的个数。 对于字符串,这个参数将返回字符串中字符的个数。

    include 模板标签

    {% include %}:该标签允许包含其他的模板内容,标签的参数是所要包含的模板名称,可以是一个变量,也可以是用单/双引号硬编码的字符串。当多个模板出现相同代码的同时,就要使用{% include %} 来减少代码的重复量。如:

    {% include 'nav.html' %}
    {% include "nav.html" %}
    {% include template_name %}  参数也可以是一个变量

    3:模板继承(实例包含titil,css content,js)

    {% extends %}:必须保证其为模板中的第一个模板标记。 否则,模板继承将不起作用。

    {% block %}:所有的 {% block %} 标签告诉模板引擎,子模板可以重载这些部分。

    {{ block.super }}:这个变量将会表现出父模板中的内容。 如果只想在上级代码块基础上添加内容,而不是全部重载,该变量就显得非常有用了

    继承的一种常见方式是下面的三层法:

    1. 创建 base.html 模板,在其中定义站点的主要外观感受。 这些都是不常修改甚至从不修改的部分。

    1. 为网站的每个区域创建 base_SECTION.html 模板(例如, base_photos.html 和 base_forum.html )。这些模板对 base.html 进行拓展,并包含区域特定的风格与设计。

    1. 为每种类型的页面创建独立的模板,例如论坛页面或者图片库。 这些模板拓展相应的区域模板。

    实例:master.html 母版

     1 {% block func %}{% endblock %}
     2 <!DOCTYPE html>
     3 <html lang="en">
     4 <head>
     5     <meta charset="UTF-8">
     6     <title>{% block tital %}{% endblock %}</title>
     7     <link rel="stylesheet" href="/static/commons.css" />
     8     {% block css %}{% endblock %}
     9 </head>
    10 <body>
    11 
    12 <h1>母版继承</h1>
    13 {% block content %}{% endblock %}
    14 <script src="/static/jquery-1.12.4.min.js"></script>
    15 {% block js %}{% endblock %}
    16 </body>
    17 </html>
    母板

    实例:slave.html 继承版

     1 {% extends 'master.html' %}
     2 {% load func1 %}
     3 {% block tital %}继承版{% endblock %}
     4 {% block css %}
     5     <style>
     6         body{ background:#eeeeee}
     7     </style>
     8 {% endblock %}
     9 {% block content %}
    10     <h2>继承版本</h2>
    11     {% include 'tag.html' %}
    12     {% include 'tag.html' %}
    13     {% include 'tag.html' %}
    14     {% include 'tag.html' %}
    15     {% count 20 40 %}
    16 {% endblock %}
    17 {% block js %}
    18     <script>alert('js继承')</script>
    19 {% endblock %}
    继承版

    注意:继承一个网页只能继承一个模板
    4:模板导入
    在html文件中使用:{% include 'tag.html' %} 可以将tag.html网页内容导入到文件中。
    5:自定义函数
    simple_tag
    1:在app下创建templatetags目录
    2:在此目录下建立任意xxx.py文件
    3:在py文件中注册simple_tag,以下为固定写法,不能修改
      from django import template
      register = template.Library() # 创建template对象,
      @register.simple_tag
      def func(a1,a2,a3..):
        return "str..."
    4:settings中注册app
    5:在需要引入的html文件的顶部载入py文件,{% load xxx %}
    6:html文件中使用:{% 函数名 arg1 arg2... %}
    优点:支持多个参数传入
    缺点:不能应用到条件判断中
    filter
    1:在app下创建templatetags目录
    2:在此目录下建立任意xxx.py文件
    3:在py文件中注册simple_tag,以下为固定写法,不能修改
      from django import template
      register = template.Library() # 创建template对象,
      @register.filter
      def func(a1,a2):
        return "str..."
    4:settings中注册app
    5:在需要引入的html文件的顶部载入py文件,{% load xxx %}
    6:html文件中使用:{{ arg1|函数名:arg2 }}
    优点:可以应用在条件判断中 {% if "china"|cstr:'beijing' %} {% endif %}
    缺点:只支持2个参数传入,不能加空格
    如:simple_tag 和 filter

     1 from django import template
     2 register = template.Library()
     3 @register.simple_tag
     4 def count(a1,a2,a3):
     5     num = a1 + a2 + a3
     6     return num
     7 @register.filter
     8 def cstr(a1,a2):
     9     num = a1 + a2
    10     return num
    11 @register.filter
    12 def power(a1):
    13     return a1.upper()
    View Code

    html文件对应写法

    1 {% load func1 %} # 导入py文件
    2 <!DOCTYPE html>
    3 <html lang="en">
    4 <head></head>
    5 <body>
    6 {% count 10 20 %} # 对应simple_tag输出30
    7 {{ "china"|cstr:'beijing' }} # 对应filter输出chinabeijing
    8 {{ 'china'|power }} #转换为大写
    9 </body>
    View Code
  • 相关阅读:
    Mybatis plus强大的条件构造器QueryWrapper条件构造器基础方法解释
    代码一键生成
    报错:error setting certificate verify locations: CAfile: D:/Git/anz/Git/mingw64/ssl/certs/ca-bundle.crt CApath: none
    safari怎么设置开发者模式,调出审查元素
    react antd Tabs组件如何修改默认样式-友好的解决方法
    css filter属性滤镜变灰
    yarn的安装和常用命令
    react-app-rewired start 启动失败报错解决方法
    react路由5到底要怎么使用(基础向)
    react中img引入本地图片的2种方式
  • 原文地址:https://www.cnblogs.com/zy6103/p/7552666.html
Copyright © 2011-2022 走看看