Django-website 程序案例系列-8 html模板文件详解
主模板:master.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{% block title %} {% endblock %}</title> #替换位置加{% block title %}{% endblock %}
<link rel="stylesheet" href="/static/commons.css">
<style> #全局css
.pg-header{
height: 48px;
background-color: seashell;
color: green;
}
</style>
{% block css %} {% endblock%} #自定义css 由继承模板时加入
</head>
<body>
<div class="pg-header">管理界面</div>
{% block content %} {% endblock %} #替换位置
<script src="/static/jquery.js"></script> #全局js
{% block js %} {% endblock %} #自定义js 由继承模板时加入
</body>
</html>
# 继承模板:
{% extends 'master.html' %} #继承模板需要添加,继承的模板来自master.html
{% block title %}用户管理{% endblock %} #替换模板中title的位置
{% block css %}<style>...</style>{% endblock %} #自定义css
{% block content %} #替换模板中content的位置
<h1>用户管理</h1>
<ul>
{% for u in user_list %}
<li>{{ u }}</li>
{% endfor %}
</ul>
{% endblock %}
{% block js %}<script src="..."></script>{% endblock %} #自定义js
#模板导入:
# 需要导入的模板 tag.html
<form action="">
<input type="text">
<input type="submit">
</form>
{% extends 'master.html' %}
{% block title %}用户管理{% endblock %}
{% block content %}
{% include "tag.html" %} #导入模板html
{% endblock %}
继承 :
{% extends '模板.html' %}
{% include "模板.html" %}
引用:
{% block 模板标题 %}{% endblock %}
关于自定义模板--simple_tag
ooxx.py
from django import template #导入模板类
from django.utils.safestring import mart_safe #给simple_tag打标记 register = tmplate.Librarry() #固定写法必须加,创建特template对象 @register.simple_tag #加simple_tag的装饰器
def houyafan(a1,a2): #返回网页的函数
return a1 + a2
{% load ooxx.py %} #导入simple_tag
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
{% houyafan 3 5 %} #调用simple_tag函数houyafan()返回 3+5=8
</body>
</html>
注:需要在app01下创建一个文件夹名字必须是: templatetags
再在templatetags下面建立py文件在py文件中写以上Python代码
建立步骤:

simple_tag---filter
@register.filter #使用filter装饰器
def check(a1, a2):
return a1 + a2
<body>
{{ "zhangjian"|check:"ZJ" }} #跟django自带的filter一样 例如:{{ name | upper }}
</body>
输出:

fliter使用的场景:
{% if {{ “xx” |check :"yy"}} %}
优缺点对比:

Django-website 程序案例系列-8 html模板文件详解的更多相关文章
- DotNetBar for Windows Forms 12.9.0.0_冰河之刃重打包版及制作Visual Studio C#项目模板文件详解
关于 DotNetBar for Windows Forms 12.9.0.0_冰河之刃重打包版 --------------------11.8.0.8_冰河之刃重打包版-------------- ...
- 小程序学习笔记三:页面文件详解之视图层WXML、WXS、WXSS文件
视图层:Pages主要有 wxml页面文件和模板文件.wxs脚本文件.wxss样式文件:component是抽取出来的业务单元,同样拥有wxml页面文件和模板文件.wxs脚本文件.wxss样式文件 ...
- 小程序学习笔记二:页面文件详解之 .json文件
页面配置文件—— pageName.json 每一个小程序页面可以使用.json文件来对本页面的窗口表现进行配置,页面中配置项会覆盖 app.json 的 window 中相同的配置项. 页面的 ...
- 第14章 启动文件详解—零死角玩转STM32-F429系列
第14章 启动文件详解 全套200集视频教程和1000页PDF教程请到秉火论坛下载:www.firebbs.cn 野火视频教程优酷观看网址:http://i.youku.com/firege ...
- vue-cli生成的模板各个文件详解(转)
vue-cli脚手架中webpack配置基础文件详解 一.前言 原文:https://segmentfault.com/a/1190000014804826 vue-cli是构建vue单页应用的脚手架 ...
- 深入浅出Mybatis系列(四)---配置详解之typeAliases别名(mybatis源码篇)
上篇文章<深入浅出Mybatis系列(三)---配置详解之properties与environments(mybatis源码篇)> 介绍了properties与environments, ...
- Android Studio系列教程五--Gradle命令详解与导入第三方包
Android Studio系列教程五--Gradle命令详解与导入第三方包 2015 年 01 月 05 日 DevTools 本文为个人原创,欢迎转载,但请务必在明显位置注明出处!http://s ...
- 【转】Eclipse Java注释模板设置详解
Eclipse Java注释模板设置详解 设置注释模板的入口: Window->Preference->Java->Code Style->Code Template 然后 ...
- 构建安全的Xml Web Service系列之wse之错误代码详解
原文:构建安全的Xml Web Service系列之wse之错误代码详解 WSE3.0现在还没有中文版的可以下载,使用英文版的过程中,难免会遇到各种各样的错误,而面对一堆毫无头绪的错误异常,常常会感到 ...
随机推荐
- arcgis_js_api_3.12的project实践
esri.config.defaults.geometryService = new esri.tasks.GeometryService("http://localhost:6080/ar ...
- [03-01] JSP自定义标签
1.自定义标签的概念 目前我们在JSP中使用的标签都是HTML的标签,浏览器会自动解析运行,例如<form action=""></form>,这里的for ...
- TCP/IP协议--TCP的交互数据流和成块数据流
前边讲了TCP连接的建立和终止,分别要三次握手和四次通信.这些报文段都只包含首部,没有数据部分. 这里就讲讲数据传送的一些细节.一个TCP连接建立成功以后,就可以开始传送数据了~ 一般TCP数据 ...
- python 方法调用
获取当前时间 today=time.strftime('%Y-%m-%d',time.localtime(time.time())) 取得时间相关的信息的话,要用到python time模块,pyth ...
- BZOJ3714 PA2014 Kuglarz 最小生成树
题目传送门 题意:有$N$个盒子,每个盒子中有$0$或$1$个球.现在你可以花费$c_{i,j}$的代价获得$i$到$j$的盒子中球的总数的奇偶性,求最少需要多少代价才能知道哪些盒子中有球.$N \l ...
- .NET Core 3.0 跟踪
Preview1: https://blogs.msdn.microsoft.com/dotnet/2018/12/04/announcing-net-core-3-preview-1-and-ope ...
- thymeleaf给bootstrap自定义变量赋值
最近在做一件事情,前端用的是thymeleaf进行渲染,thymeleaf是通过 th的标签来赋值对应的后端变量的.但是遇到一个尴尬的问题,bootstrap是可以通过data-xxx,来自定义变量的 ...
- Ionic下的JPush缺少统计代码问题解决方法
用Ionic打包apk后安装到手机,收到缺少统计代码的提示,解决方法如下: 1. 找到了 platforms/android/src/com/ionichina/ioniclub/MainActiov ...
- 设计模式:装饰模式(decorate)
还是那几句话: 学无止境,精益求精 十年河东,十年河西,莫欺少年穷 学历代表你的过去,能力代表你的现在,学习代表你的将来 废话不多说,直接进入正题: 今天学习了装饰模式,但是代码看不太懂,于是我将装饰 ...
- JavaScript 利用 async await 实现 sleep 效果
const sleep = (timeountMS) => new Promise((resolve) => { setTimeout(resolve, timeountMS); }); ...