主要内容:母版,继承母版,块,组件,静态文件

母版

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title</title>
{% block page-css %} {% endblock %}
</head>
<body> <h1>这是母板的标题</h1> {% block page-main %} {% endblock %}
<h1>母板底部内容</h1>
{% block page-js %} {% endblock %}
</body>
</html>

注意:我们通常会在母版中定义页面专用的CSS块和JS块,方便子页面替换

继承母版

在子页面中在页面最上方使用下面的语法来继承母版

{% extends 'layouts.html' %}

块(block)

通过在模板中使用{% block xxx %} 来定义“块”。

在子页面中通过定义母版中的block名来对应替换母版中相应的内容。

{% block page-main %}
<p>花褪残红青杏小</p>
<p>燕子飞时</p>
<p>绿水人家绕</p>
<p>枝上柳绵吹又少</p>
<p>天涯何处无芳草</p>
{% endblock %}

组件

可以将常用的页面内容如导航条,页尾信息等组件保存在单独的文件中,然后在需要使用的地方按如下语法导入即可。

{% include 'navbar.html' %}

静态文件相关

{% load static %}
<img src="{% static "images/hi.jpg" %}" alt="Hi!" />

引用JS文件时使用:

{% load static %}
<script src="{% static "mytest.js" %}"></script>

某个文件多出被用到可以存为一个变量

{% load static %}
{% static "images/hi.jpg" as myphoto %}
<img src="{{ myphoto }}"></img>

使用get_static_profix

{% load static %}
<img src="{% get_static_prefix %}images/hi.jpg" alt="Hi!" />

或者

{% load static %}
{% get_static_prefix as STATIC_PREFIX %} <img src="{{ STATIC_PREFIX }}images/hi.jpg" alt="Hi!" />
<img src="{{ STATIC_PREFIX }}images/hi2.jpg" alt="Hello!" />

自定义simpletag

和自定义filter类似,只不过接受更灵活的参数。

定义注册simple tag

@register.simple_tag(name="plus")
def plus(a, b, c):
return "{} + {} + {}".format(a, b, c)

使用自定义simple tag

{% load app01_demo %}

{# simple tag #}
{% plus "" "" "abc" %}

inclusion_tag

多用于返回HTML代码片段

示例:

templatetages/my_inclusion.py

from django import template

register = template.Library()

@register.inclusion_tag('result.html')
def show_results(n):
n = 1 if n < 1 else int(n)
data = ["第{}项".format(i) for i in range(1, n+1)]
return {"data": data}

templates/result.html

<ul>
{% for choice in data %}
<li>{{ choice }}</li>
{% endfor %}
</ul>

templates/index.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>inclusion_tag test</title>
</head>
<body> {% load my_inclusion %} {% show_results 10 %}
</body>
</html>

django模板系统(下)的更多相关文章

  1. django模板系统基础

    模板系统基础Django模板是一个string文本,它用来分离一个文档的展现和数据 模板定义了placeholder和表示多种逻辑的tags来规定文档如何展现 通常模板用来输出HTML,但是Djang ...

  2. python MVC、MTV 框架介绍 Django 模板系统常用语法

    Django 框架简介一.MVC框架和MTV框架1.MVC 全名Model View Controller,是软件工程中的一种软件架构模式,把软件系统分为三个基本部分.优势: 耦合性低 重用性高 生命 ...

  3. Django 模板系统

    Django模板系统 常用语法 {{}} 变量相关 {%%} 逻辑相关 变量 格式 {{ 变量名 }} 命名规则 包括任何字母数字以及下划线 ("_")的组合 变量名称中不能有空格 ...

  4. Python学习(二十八)—— Django模板系统

    转载自http://www.cnblogs.com/liwenzhou/p/7931828.html Django模板系统 官方文档 一.常用语法 只需要记两种特殊符号: {{  }}和 {% %} ...

  5. Django模板系统(非常详细)(后台数据如何展示在前台)

    前面的章节我们看到如何在视图中返回HTML,但是HTML是硬编码在Python代码中的这会导致几个问题:1,显然,任何页面的改动会牵扯到Python代码的改动网站的设计改动会比Python代码改动更频 ...

  6. (转)Django学习之 第四章:Django模板系统

    前面的章节我们看到如何在视图中返回HTML,但是HTML是硬编码在Python代码中的 这会导致几个问题: 1.显然,任何页面的改动会牵扯到Python代码的改动 网站的设计改动会比Python代码改 ...

  7. Django模板系统

    创建模板对象Template类在django.template模板中 // 用django-admin.py startproject 命令创建一个项目目录django-admin.py startp ...

  8. django模板系统(上)

    filters 过滤 default 替代作用 filesizeformat 格式化为人类可读 add 给变量加参数 lower 小写 upper 大写 title 标题 ljust 左对齐 rjus ...

  9. python终极篇 ---django 模板系统

                                                模板系统                                                . MV ...

  10. Django模板系统:Template

    一.模板常用语法 1.1 变量 符号:{{ }} 表示变量,在模板渲染的时候替换成值 使用方式:{{ 变量名 }}:变量名由字母数字和下划线组成 点(.)在模板语言中有特殊的含义,用来获取对象的相应属 ...

随机推荐

  1. ffplay源码分析4-音视频同步

    本文为作者原创,转载请注明出处:https://www.cnblogs.com/leisure_chn/p/10307089.html ffplay是FFmpeg工程自带的简单播放器,使用FFmpeg ...

  2. zoj 1109 Language of FatMouse(map映照容器的典型应用)

    题目连接: acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=1109 题目描述: We all know that FatMouse doe ...

  3. nodejs的__dirname,__filename,process.cwd()区别

    假定我们有这样一个mynode的node项目在User/leinov/porject/文件夹下,cli是一个可执行文件 |-- mynode |-- bin |-- cli.js |-- src |- ...

  4. C#基础知识回顾--串行化与反串行化

    串行化是指存储和获取磁盘文件.内存或其他地方中的对象.在串行化时,所有的实例数据都保存到存储介质上, 在取消串行化时,对象会被还原,且不能与其原实例区别开来.只需给类添加Serializable属性, ...

  5. Nodejs+Express构建网站

    1.预先安装(系统环境widows): nodejs  可在官网下载安装  https://nodejs.org/en/ visual studio code  可在官网下载安装  http://co ...

  6. PetaPoco源代码学习--2.TableInfo、ColumnInfo类和Cache类

    当把常用的特性填写到POCO实体类时,执行数据库操作时,需要根据实体类上的特性信息进行相应的操作,PetaPoco中的TableInfo和ColumnInfo类就是用来保存实体类上的特性信息. Tab ...

  7. iOS: Designated Initializer(指定初始化函数)

    偶然间看到“ Designated Initializer”一词,心里一惊,这是什么东西,怎么没听说过?难道是我道行太浅?真的是这样?(好伤心啊)一阵子我怀疑之后,果断上网查了一下这个 Designa ...

  8. 无框架JavaWeb简单增删改查,纯 jsp小练习

    地址 : 纯本人手码 jsp练习>>>>>

  9. Netty中消除开始的日志消息修改日志级别

    我是使用logback作为日志打印,之前使用slf4j,日志打印不出,就干脆换掉了. 1.首先引入依赖 <dependency> <groupId>ch.qos.logback ...

  10. Vue 爬坑之路(十)—— Vue2.5 + Typescript 构建项目

    Typescript 在前端圈已经逐渐普及,Vue 2.5.0 改进了类型声明,使得对 TypeScript 更加友好 不过要想在项目中直接使用 TypeScript  仍然需要对项目进行一些改造 P ...