Django学习之静态文件与模板详解_Python

前言

我们已经配置完Django，今天就来学学静态文件与模板的放置使用。

模板

在上一章节中我们的视图函数test使用了HttpResponse返回一个字符串

Django学习之静态文件与模板详解

作为我们第一个Django程序

Django学习之静态文件与模板详解

但只有这些是远远不够的，你说要是别人看自己的网页就几行文字在那里，既不美观也无意义。

存放目录

我们平时看到的网页都是通过HTML向我们呈现的内容的，Django也一样。一个完整系统必须有着大量网页用于实现不同的功能，而那些HTML文件也有一个专门存放的目录叫templates模板。这个目录一般在APP目录下创建，每个APP均可创建一个templates用来存放HTML文件。当我们调用HTML文件的时候，系统就会根据APP的注册顺序在每个APP下的templates找所需要的HTML文件。

模板调用

那么现在我们在APP文件下创建一个templates目录。

Django学习之静态文件与模板详解

并在该目录下创建一个名为demo的HTML文件

Django学习之静态文件与模板详解

输入些内容后就在能在视图函数调用这个模板了。

进入view.py文件定义一个函数以调用demo.html模板。

from django.shortcuts import render, HttpResponse
 
 
# Create your views here.
 
def test(request):
    return render(request, "demo.html")

注意：函数一定要加上 request参数，在引用html模板时使用的render同样需要加上request参数。

接下来在url.py文件中，确定好关系就OK了。(网页路径以hd/为例)

Django学习之静态文件与模板详解

点击运行后，输入网址http://127.0.0.1:8000/hd/进入。

Django学习之静态文件与模板详解

就能看到跟上图类似的运行结果了。

模板语法

Django不是标记语言，它能进行数据处理。渲染网页前会先执行Django语句，然后将得出的符合逻辑的能够呈现给用户看的结果替换掉对应位置的Django语句。

数据传递

在制作网页时，如果我们不能一下子知道元素的值，比如需要通过数据库才能获取数据操作等，那么我们就要在视图函数中将需要的数据以字典的形式进行传递给HTML。值得高兴的是，常用的数据类型都能传递。

传递方法：将变量以字典形式通过render函数进行传递，在HTML引用时，通过双花括号+键名引用。

现在试试吧！

在视图函数编写些函数，然后传递过去

    s = "这是一个字符串"
    d = {"这是一个": "字典"}
 
    return render(request, "demo.html", {"str": s, "dict": d})

之后在对应的HTML页面引用它

<h3> {{ str }} {{dict}}</h3>

最后点运行。

Django学习之静态文件与模板详解

元素引用

Django同样支持引用字典，列表，元组等数据类型里面的值，不一样的是Django用.取代了[]。

比如想引用字典里面的值需要通过 {{字典名.键名}} 来引用值（注意，键名无需使用引号。），如果想引用列表则 {{列表名.索引值}} 亦或者多维列表 {{列表名.索引1.索引2...}} 来引用。

view.py

def test(request):
    d = {"这是一个": "字典"}
    l1 = [1, 2, 3]
    l2 = [[1, 2], [3, 4]]
    return render(request, "demo.html",
                  {"list1": l1, "dict": d, "list2": l2}
                  )

demo.html

<body>
<h1>快看调用成功了没有？</h1>
<h3> {{list1.0}}</h3>
<h3> {{list2.0.1}}</h3>
<!--注意键名无需带引号-->
<h3> {{dict.这是一个}}</h3>
</body>

结果

Django学习之静态文件与模板详解

for语句

Django也支持循环语句，但在使用完循环后需要加结束语句。这些命令都在 {% 命令 %}尖括号百分号之间。{与%之间没有空格

循环使用字典时，如果你想获取键（keys）,值（values），键值对（items）后面都不需要添加括号。

先看字典

    d = {"今天": "天气", "真不错": "对吗？"}
    l1 = [1, 2, 3]
    return render(request, "demo.html",
                  {"list1": l1, "dict": d}
                  )

<h1>快看调用成功了没有？</h1>
<!--无需带括号-->
{% for k, v in dict.items %}
    <h4>{{k}} -- {{v}}</h4>
{% endfor %}

Django学习之静态文件与模板详解

再看看列表，Django不支持range，所以只能迭代列表。

还是那串代码

def test(request):
    d = {"今天": "天气", "真不错": "对吗？"}
    l1 = [1, 2, 3, 4]
    return render(request, "demo.html",
                  {"list1": l1, "dict": d}
                  )

只是改了HTML

&lt;h1&gt;快看调用成功了没有？&lt;/h1&gt;{% for i in list1 %}    &lt;h4&gt;{{list1}}&lt;/h4&gt;    &lt;h4&gt;{{i}}&lt;/h4&gt;    &lt;!--不能这样输出值--&gt;    &lt;h4&gt;{{list1.i}} 前面好像没输出&lt;/h4&gt;{% endfor %}

循环最后要使用endfor结束。另外，似乎不能通过列表值来访问列表元素，导致{{list1.i}}没有值

Django学习之静态文件与模板详解

if语句

Django同样支持条件语句。

<!--list = [1,2,3,4]-->
<!--list.1 = 2-->
{% if list.1 == 0 %}
    <h1>11111111111111111</h1>
{% elif list.1 == 1 %}
    <h1>2222222222222222222</h1>
{% else %}
    <h1>333333333333333333333</h1>
{% endif %}

Django学习之静态文件与模板详解

静态文件

为了能够呈现更精美的内容亦或者提高代码编写效率，我们往往会使用到一些静态文件。

在开发过程中一般将图片，插件，css，js等当做静态文件处理。

存放目录

静态文件那么重要当然有他们各自的归宿，它们都存放在static目录下。同样的static目录也在APP下面创建，每个APP都可以有一个专门存放静态文件的目录static。我们最好也能在static下对不同类型的文件进行分类存放。如，图片存放在img文件夹中，插件存放在plugins文件夹中，css文件存放在css文件夹，js存放在js文件夹。

Django学习之静态文件与模板详解