django模板系统(下)
主要内容:母版,继承母版,块,组件,静态文件
母版
<!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模板系统(下)的更多相关文章
- django模板系统基础
模板系统基础Django模板是一个string文本,它用来分离一个文档的展现和数据 模板定义了placeholder和表示多种逻辑的tags来规定文档如何展现 通常模板用来输出HTML,但是Djang ...
- python MVC、MTV 框架介绍 Django 模板系统常用语法
Django 框架简介一.MVC框架和MTV框架1.MVC 全名Model View Controller,是软件工程中的一种软件架构模式,把软件系统分为三个基本部分.优势: 耦合性低 重用性高 生命 ...
- Django 模板系统
Django模板系统 常用语法 {{}} 变量相关 {%%} 逻辑相关 变量 格式 {{ 变量名 }} 命名规则 包括任何字母数字以及下划线 ("_")的组合 变量名称中不能有空格 ...
- Python学习(二十八)—— Django模板系统
转载自http://www.cnblogs.com/liwenzhou/p/7931828.html Django模板系统 官方文档 一.常用语法 只需要记两种特殊符号: {{ }}和 {% %} ...
- Django模板系统(非常详细)(后台数据如何展示在前台)
前面的章节我们看到如何在视图中返回HTML,但是HTML是硬编码在Python代码中的这会导致几个问题:1,显然,任何页面的改动会牵扯到Python代码的改动网站的设计改动会比Python代码改动更频 ...
- (转)Django学习之 第四章:Django模板系统
前面的章节我们看到如何在视图中返回HTML,但是HTML是硬编码在Python代码中的 这会导致几个问题: 1.显然,任何页面的改动会牵扯到Python代码的改动 网站的设计改动会比Python代码改 ...
- Django模板系统
创建模板对象Template类在django.template模板中 // 用django-admin.py startproject 命令创建一个项目目录django-admin.py startp ...
- django模板系统(上)
filters 过滤 default 替代作用 filesizeformat 格式化为人类可读 add 给变量加参数 lower 小写 upper 大写 title 标题 ljust 左对齐 rjus ...
- python终极篇 ---django 模板系统
模板系统 . MV ...
- Django模板系统:Template
一.模板常用语法 1.1 变量 符号:{{ }} 表示变量,在模板渲染的时候替换成值 使用方式:{{ 变量名 }}:变量名由字母数字和下划线组成 点(.)在模板语言中有特殊的含义,用来获取对象的相应属 ...
随机推荐
- Code First, Database First, Same Time区别
Code First, Database First, Same Time是我理解的asp.net mvc中用到的三种model与数据库对应的方式,肯定是不全面的,理解也有些狭隘,今后随着自己的理解加 ...
- vue的项目优化---回顾
陆陆续续也用vue开发或重构了不少项目,在这期间遇到不少的坑,也尝试过优化.在此记录一下,想到一点算一点吧: 一.尽可能的减少watcher的数量 当监听数据是一个对象的时候,最好具体到监听对象的 ...
- js设计模式总结4
链模式 链模式:通过在对象方法中将当前对象返回,实现对同一个对象多个方法的链式调用,从而简化多次调用该对象多个方法时的对该对象的多次引用. 具体不多说:主要是方法最后return this; 委托模式 ...
- Windows Live Writer 2012离线发布WP文章教程
1. WLW简介 Windows Live Writer是一款微软开发的文章离线发布软件,对博客文章的排版类似Word操作,比普通的HTML编辑器更强大的是其离线发布功能.支持新浪博客.网易博客.博客 ...
- .3-浅析webpack源码之预编译总览
写在前面: 本来一开始想沿用之前vue源码的标题:webpack源码之***,但是这个工具比较巨大,所以为防止有人觉得我装逼跑来喷我(或者随时鸽),加上浅析二字,以示怂. 既然是浅析,那么案例就不必太 ...
- Windows 忘记登录密码解决方法 【摘抄于百度】
一.简单的方法: 开机启动windows,进入欢迎界面后,会出现输入用户名密码提示框,这时候,同时按住Ctrl+Alt+Delete,会跳出一个账号窗口,输入用户名:administer,按回车即可. ...
- 【JVM】1、java虚拟机参数-X 与 -XX的区别
Options that begin with -X are non-standard (not guaranteed to be supported on all VM implementation ...
- SSM整合的pom.xml依赖
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/20 ...
- 阿里数据源Druid配置详情
<bean name="dataSource" class="com.alibaba.druid.pool.DruidDataSource" init-m ...
- linux系统编程:用truncate调整文件大小
truncate的使用非常简单: int truncate(const char *path, off_t length); 参数1:文件名 参数2: 文件需要被调整的大小 length 大于 文件 ...