Django之模板2
模板2
一 、 母版
<!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块,方便子页面替换。
继承母版:
1.在子页面中在页面最上方使用下面的语法来继承母板。
{% extends 'layouts.html' %}
2.通过在母板中使用{% block 块名%}来定义"块"。
在子页面中通过定义母板中的block名来对应替换母板中相应的内容。
{% block 块名 %}
...
...
{% endblock %}
二 、 组件
可以将常用的页面内容如导航条,页尾信息等组件保存在单独的文件中,然后在需要使用的地方按如下语法导入即可。
其实就是一个公用的一段html代码单独放置在一个HTML文件中,那个网页需要就引用即可(常用于导航栏等)
{% include 'navbar.html' %}
三 、 静态文件相关
1、直接使用
1.引用css
{% load static %}
{#<link rel="stylesheet" href="/static/bootstrap.css">#}
<link rel="stylesheet" href="{% static 'bootstrap.css' %}"> {# 动态获取静态路径 #}
2.引用js
{% load static %}
<script src="{% static 'jquery-3.3.1.js' %}"></script>
<script src="{% static 'bootstrap.js' %}"></script>
3.文件多处被用到可以存为一个变量
{% load static %}
{% static "images/image1.jpg" as myphoto %}
<img src="{{ myphoto }}"></img>
2 、 使用get_static_prefix
使用方法和直接使用类似(只获得静态路径前缀,然后再去拼接)
{% load static %}
<img src="data:images/image1.jpg" alt="Hi!" />
<link rel="stylesheet" href="{% get_static_prefix %}bootstrap.css"> {# 动态获取静态路径 #}
{% load static %}
<img src="{% get_static_prefix %}images/image1.jpg" alt="Hi!" />
{% load static %}
{% get_static_prefix as presfix_ %}
<img src="{{ preafix_ }}images/image1.jpg" alt="Hi!" />
四 、自定义simpletag
和自定义filter类似,只不过接收更灵活的参数。
在app文件夹下边创建 templatetags 的 python package包
from django import template register = template.Library() @register.simple_tag #必须写装饰器,不然django不知道
def str_add(a, b, c, d):
return '%s+%s+%s+%s' % (a, b, c, d)
使用
{% load my_simple_tag %} {# 先下载#}
{% str_add '我' '的' '名字是:' '小明' %} {# 文件中要使用的函数名,和 参数 #}
五 、inclusion_tag
多用于返回html代码片段(比组件变动更灵活)
1.在在app文件夹下边的 templatetags 的 python package 中创建一个 my_inclusion_tag.py 文件
from django import template
register = template.Library()
@register.inclusion_tag('paging.html')
def func(total,current_num):
return {'total':range(1,total + 1),'current_num':current_num}
2.在展示列表中下载后调用定义的函数
{% load my_inclusion_tag %}
{% func 8 5 %}
3.在需要调用返回的html一段代码
<ul class="pagination">
{% for num in total %}
{% if num == current_num %}
<li class="active"><a href="#">{{ num }}</a></li>
{% else %}
<li><a href="#">{{ num }}</a></li>
{% endif %}
{% endfor %}
</ul>
流程大致如下图

Django之模板2的更多相关文章
- python学习笔记--Django入门二 Django 的模板系统
为了使网站更干净简洁更容易维护,页面的设计和Python的代码必须分离开.我们可以使用Django的 模板系统 (Template System)来实现这种模式. 几个简单的模板标签(tag): ...
- 第四章:Django 的模板系统(转)
在之前的章节中,你可能觉得例子中视图返回文本有点不妥.即是, HTML 是直接写在 Python 代码中的. 这种做法会导致这些问题: 要做任何设计上的更改就必须改写 Python 代 ...
- Django使用模板后无法找到静态资源文件
Django使用模板后无法找到静态资源文件 环境配置 Django版本1.11 python版本3.6.2 前言 在编写Django网站的时候,在涉及模板方面,一些简单的例子都没有问题,但这些例子都有 ...
- django的模板(二)
模板(二) 实验简介 本节继续介绍模板的常用标签,for.if.ifequal和注释标签. 一.基本的模板标签和过滤器 1. 标签 if/else {% if %} 标签检查(evaluate)一个变 ...
- django之模板显示静态文件
由于django的模板渲染机制,图片不能直接引用,否则不会显示. <img src="/static/img/logo.jpg"> 可以看出图片的大小轮廓,但并不显示内 ...
- Django之模板系统
变量的使用: def test(request): num=1 s='hello' li=[1,2,['a','b']] dic={'name':'w','age':1} se={1,2,3} tup ...
- django默认模板引擎和jinja2模板引擎
在使用中,大家会发现django默认模板引擎有很多局限性,最明显的就是四则运算.就只能加减,乘除都不支持.另外还有判断相等,不能直接if,要用ifequal.确实不太方便.还有一点,django默认模 ...
- Django之模板
Django模板系统 官方文档 常用语法 Django模板中只需要记两种特殊符号: {{ }}和 {% %} {{ }}表示变量,在模板渲染的时候替换成值,{% %}表示逻辑相关的操作. 变量 {{ ...
- Django的模板系统
一.语法 关于模板渲染只需要记住两种特殊符号(语法): {{ }} 和 {% %} (变量相关用{{ }} 逻辑相关用{% %}) 二.变量 在Django的模板语言中按照{{ 变量名 }}来使用 ...
- Django的模板语言
Django模板系统 官方文档 常用语法 只需要记两种特殊符号: {{ }}和 {% %} 变量相关的用{{}},逻辑相关的用{%%}. 变量 {{ 变量名 }} 变量名由字母数字和下划线组成. ...
随机推荐
- 网络编程—udp
一.ip地址 1. 什么是地址 地址就是用来标记地点的 2. ip地址的作用 ip地址:用来在网络中标记一台电脑,比如192.168.1.1:在本地局域网上是唯一的. 3. ip地址的分类 每一个IP ...
- java web----TCP/DUP 通信
服务端和单客户端通信 注意事项:如果服务端或者客户端采用read() 一个字节这种读取数据,只要另一方没有关闭连接,read是永远读取不到-1,会陷入死循环中: 解决方法:加上一个判断,程序员自己跳出 ...
- linux下搭建SVN
官网下载: http://subversion.apache.org/packages.html SVN客户端:TortoiseSVN :https://tortoisesvn.net/downl ...
- Jmeter中通过beanshell写入CSV的脚本
import com.csvreader.CsvWriter; String NewDataPath=bsh.args[0]; NewDataPath=NewDataPath.replaceAll(& ...
- 关于HTML或JS加密解密的七种方式
本文一共介绍了七种方法: 一:最简单的加密解密 二:转义字符""的妙用 三:使用Microsoft出品的脚本编码器Script Encoder来进行编码 (自创简 ...
- 使用Bazel构建C/C++项目
目录 前提 基本概念 速查链接汇总 stage1: 一个package, 一个target stage2: 一个package,多个target stage3: 多package,多target st ...
- org.apache.thrift.transport.TTransportException: Could not create ServerSocket on address 0.0.0.0/0.0.0.0:9083.
1.启动hive的过程中,[hadoop@slaver1 soft]$ hive --service metastore &错误如下所示: 原因:之前启动hive失败了,但是进程以及启动起来, ...
- [转] 深入浅出mongoose-----包括mongoose基本所有操作,非常实用!!!!!
深入浅出mongoose mongoose是nodeJS提供连接 mongodb的一个库. 此外还有mongoskin, mongodb(mongodb官方出品). 本人,还是比较青睐mongoose ...
- jquery .On()绑定事件的触发机制
选择器只能选择已存在元素,其他元素需要作为参数传递给on
- Oracle Instant Client(即时客户端) 安装与配置
一.下载 下载地址:http://www.oracle.com/technetwork/database/features/instant-client/index-097480.html 这是Ora ...