django系列4.2--自定义标签, 自定义过滤器, inclusion_tag, 引入静态文件(css,js等)

本文详细介绍了在Django项目中如何自定义模板标签、过滤器及inclusion_tag,实现对HTML代码的动态生成与复用,并阐述了静态文件(js、css、img)的正确配置方法。

项目的目录为

1547033-20190304221631603-1721601036.png

在app中创建templates时,最好要再创建一个app名相同的文件夹,因为项目找文件时从第一个app开始遍历,不同app内的同名文件会有冲突,所以这样处理

一.自定义标签和过滤器

1.在settings中的INSTALLED_APPS配置当前app,否则django无法找到自定义的simple_tag

2.在app中创建templatetags模块(模块名只能是templatetags)

3.创建 任意名称的.py 文件,如: my_tags.py

from django import template
from django.utils.safestring import mark_safe
 
register = template.Library()   #register的名字是固定的,不可改变
@register.filter
def filter_multi(v1,v2):
    return v1 * v2
    
@register.simple_tag
def simple_tag_multi(v1,v2):
    return v1 * v2
    
@register.simple_tag
def my_input(id,arg):
    result = "<input type='text' id='%s' class='%s' />" %(id,arg,)
    return mark_safe(result)

4.使用自定义simple_tag和filter的html文件中导入之前创建的my_tags.py

{% load my_tags %}

5.使用simple_tag和filter

{% load xxx %}

{{ num|filter_multi:2 }}

filter可以用在if,for等语句后面, simple_tag不可以


二.inclusion_tag

多用于返回html代码片段
1547033-20190310172136809-1482941644.png

templates/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/snippets/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>


三.引入静态文件

js, css, img 文件等都叫做静态文件, 那么关于django中静态文件的配置, 我们就需要在settings配置文件里面协商这些内容

STATIC_URL = '/xxx/'  # 别名

STATICFILES_DIRS = [
    os.path.join(BASE_DIR,"jingtaiwenjian"),
]

{% static %}

{% 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_prefix %}

{% 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!" />

转载于:https://www.cnblogs.com/robertx/p/10473630.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值