django模板使用的总结

一、静态资源的引入方式

1.在项目根目录下创建 static文件夹。

2.settings.py 中配置环境变量，方便程序可以识别此路径。

要在 STATIC_URL = '/static/' 下边添加下面代码

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'static'), 
]
或
STATICFILES_DIRS = os.path.join(BASE_DIR, 'static')

3.前端引入
在页面顶部：

{% load static %} 
#引入CSS、JS，相当于拼接的字符串路径 
{% static 'xxx.css' %}　
{% static 'xxx.js' %}

二、模板(template)包含、继承与 {% block %} 的用法

使用模板前，先设置settings.py里的变量TEMPLATES的'DIRS'值，模板目录templates添加为环境变量，这样Django才能自动找到模板页面：

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'templates')],  #这行要修改
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

Django模板存放方式有两种方法：

1、在项目根下创建templates目录，然后把模板存入在templates目录里，多个APP的话，就直接在templates目录下建立与APP名相同名称的目录即可。Django会自动查找到，这种方法简单、直观，适合个人或小项目。例：myblog\templates\blog\；myblog\templates\blog2\；myblog\templates\blog3\;

2、各个APP下单独建立一个templates目录，然后再建立一个与应用名相同的的目录，把模板放到对应的目录里。这样的方法适合大项目多人协作，每个人只负责各自的APP项目的时候。多样式多站点(域名)的情况也适用，不同的APP用不同的模板样式，不同的域名。例：myblog\blog\templates\blog；myblog\blog2\templates\blog2\；myblog\blog3\templates\blog3\;

两种方法，模板调用方法一样：

return render(request, 'app/index.html', context)

两种方法各有优点，大家选适合自己的就好，后面本教程就用第一个方法。

一般的网站所有页面的头部和尾部都一样，只有中间的部分不一样。这时我们就可以把这个页面分为三个部分，每个部分分别存放在页面head.html、index.html、footer.html中，其中，头部head.html用来放所有页面头部相同的代码、主体部分index.html放与其它页面不相同的代码、尾部head.html放与其它页面尾部相同的代码。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>MyBlog</title>
</head>
<body>
<div>头部</div>
#-----------以上部分可以保存成header.html，作为头部------------

<div>中部</div> #这一句作为中部index.html

#-----------以下部分可以保存成footer.html，作为底部------------

<div>尾部</div> </div> </body> </html>

index.html内容如下，是不是就简单的实际了头尾不变，只变中间的内容。其实如果你想拆分，可以拆成无数个块，然后再组合，只改你想改变的块就可以。这个就是块的标签{% block content %}

{% include 'head.html' %}
<div>中部</div>
{% include 'footer.html' %}

我们使用base页面作为基础页面，就保含一些固定的内容。{% block xxx%} {% endblock %} 这两个之间的就是内容会填充的地方。

templates/base.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>MyBlog</title>
</head>
<body>
<div>头部</div>

{% block content %}

{% endblock %}

{% block test%}

{% endblock %}

<div>尾部</div> </div> </body> </html>

templates/index.html

{% extends "base.html" %} 
{% block content %}
<div>中部</div>
{% endblock %}

{% block test%}
<div>test内容</div>
{% endblock %}

说明：

这里面的{% extends "base.html" %} 的意思是继承 base.html页面的代码，需要留意的是，使用继承方法的话，这个代码一定要放页面的第一行。

块一般以{% block xxx %}开始，你要变化的动态的内容放到中间，以 {% endblock %}结尾。其中xxx在base.hmtl随意起名，在引入的页面中使用对应的名字就会填充到对应的块位置。这里有两个块：一个content、一个test块。

posted on 2023-08-07 16:45 白灰阅读(53) 评论(0) 编辑收藏举报

刷新页面返回顶部