08.Django自定义模板，自定义标签和自定义过滤器
一：自定义模板
模板继承我们可以简单的理解为类的继承，其实他们有很大的相似之处，定义一个基类模板，我们便可以在子页面中进行引用,django中模板中的块用block进行标示，他属于django自定义的tag
例如：我们定义了一个基类的模板base.html
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="description " content="Thinkgamer 博客" /> <meta name="keywords" content="Thinkgamer 博客" /> <title>{% block title %}{% endblock %}</title> <link type="text/css" rel="stylesheet" href="/static/css/base_css/base_logre.css" /> </head> <body> <script language="JavaScript"> {% if error %} alert("{{ error }}"); {% endif %} </script> <a class="logo" href="/"><img src="/static/image/login.png" /></a> <h2 class="lrr-sub">CYANSCIKIT</h2> {% block container%} {% endblock %} <div class="hmc-copyright"> Copyright 2014-2015 | 版本1.0 | Made By CyanScikit </div> </body> </html>login.html 继承base模板
{% extends "base_logre.html" %}
{% block title %}
欢迎登陆CyanScikit科技网站
{% endblock %}
{% block container %}
<div class="reg-log-main login">
<div class="rlm_content">
<form action="" method="post">
<div class="rlmcl_content phone">
<input type="text" name="account" id="user" placeholder="用户名" />
</div>
<div class="rlmcl_content pwd">
<input type="password" name="password" id="pwd" placeholder="密码" />
</div>
<p>
<input type="radio" name="check" />记住密码
</p>
<div class="log_reset">
<button class="btn" id="enterlogin" onClick="check()">登 录</button>
<span>
<a style="float:left;cursor:pointer" href="/index/index" >随便看看<i></i></a>
<a style="float:right;cursor:pointer" href="/logre/regeister">新手注册<i></i></a>
</span>
</div>
</form>
</div>
</div>
{% endblock %}
regeister.html 继承base.html
{% extends "base_logre.html" %}
{% block container %}
<div class="reg-log-main regist">
<form action="" method="post">
<div class="rlm_content">
<div class="rlmcl_content phone">
<input type="text" name="name" id="user" placeholder="用户名" />
</div>
<div class="rlmcl_content pwd">
<input type="password" id="password" name="pwd" placeholder="密码" />
</div>
<div class="log_reset">
<button class="btn" id="enterlogin">注 册</button>
<span>
<a style="float:left;cursor:pointer" href="/index/index" target="_blank">随便看看<i></i></a>
<a style="float:right;cursor:pointer" href="/logre/login" >账户登录<i></i></a>
</span>
</div>
</div>
</form>
</div>
{% endblock %}
效果图如下：
二：自定义标签
其实前边已经提到了django的标签功能，django自身提供了许多标签，例如if, for, block.....但这并不能满足我们实际开发中的需求，幸好django支持自定义标签，下面我们拿个例子来详细说一下
比如我们要定义一个upper的标签，其作用是将字符串全部转换为大写
首先在你要加载这个tag的app中新建一个Python Package，创建一个upper.py
#coding:utf-8 from django import template register = template.Library() class upperNode(template.Node): def __init__(self,nodelist): self.nodelist = nodelist def render(self, context): content = self.nodelist.render(context) return content.upper() @register.tag def upper(parser,token): nodelist = parser.parse("endupper") #指定结束符 parser.delete_first_token() return upperNode(nodelist)
我是在logre的模块下创建的，然后在login.html中加载：
{% load upper %}
{% upper %}
这是我自定义的标签{{ test }}
{% endupper %}
login函数传参如下：
return render_to_response("logre/login.html", {"test":"test",})前端显示如下：
其他更加有趣的tag还请大家自己动手实现
三：自定义过滤器
自定义过滤器其实和自定义标签是很相似的，其目的都是为了使显示达到自己想要的内容或者格式
创建 assets.py，和二中tag在同一目录下，其作用是在全局变量的变动下加载不同的css
首先在settings.py文件中 设置一个变量 IS_DEVELOP=True,作用是当问true时加载测试的css，False时加载正常用的css
asserts.py:
#coding:utf-8 from django import template from my_blog.settings import IS_DEVELOP register = template.Library() @register.filter def assets(value): if IS_DEVELOP: return "/static/css/test.css" return "/static/css/base_css/base_logre.css"
在base.html中做如下修改
{% load assets %}
<link type="text/css" rel="stylesheet" href="{{ '/static/css/base_css/base_logre.css | assets' }}" />
这边这个图是IS_DEVELOP为True时的情况：
css链接为： <link type="text/css" rel="stylesheet" src="/static/css/test.css" />
下面是IS_DEVELOP为false时：
css链接： <link type="text/css" rel="stylesheet" src="/static/css/base_css/base_logre.css" />
哈哈，又恢复正常了吧