Django入门教程模板继承和静态资源的使用

　　1、模板继承

 

　　对于一个网站来说，会存在很多的html文件，但是由于一些页面中会有相同的页面结构出现。也就导致了多个html文件中代码是重复的，所以为了在html中减少重复的代码的出现，简化html结构，可以将多个页面中相同的html代码，单独的抽离出来放在一个html文件中，其他的html文件如果想要使用这部分内容，直接继承过去就可以了，有点类似于类的继承关系。

 

　　继承关系：父模板和子模板。

 

　　2、假设现在有一个网站，它的首页、列表页和详情页这些页面，页面顶部的导航条和页面底部的工具条是一样的，唯一变化的就是其中内容。画了一个简陋的图，大致如下图所示：

 

　　对于这个网站，其页面结构%70（浮夸风（）？"""）以上的内容都是相似的，如果我们每一个html文件都写入这些相同部分的代码，也是可以的，只是会造成代码的冗余等。为了方便解决这个问题，减少重复代码的出现，模板的继承就很好的解决了这个问题。

 

　　现在我们来实现模板的继承。

 

　　1、创建项目和app

 

　　django-admin startproject djangotemplateinherit

 

　　cd djangotemplateinherit

 

　　python manage.py startapp teminherit

 

　　2、在项目根目录下创建templates文件夹。

 

　　3、在urls.py文件中编写路由。

 

　　4、编写业务逻辑，即视图函数。

 

　　5、在templates文件夹下新建3个html文件。

 

　　4、再新建一个nav.html，表示公共的导航条部分。

 

　　同时，我们在views.py文件中更改视图函数，渲染模板。

 

　　5、我们在nav.html中写入如下代码

 

　　6、分别在index.html，list.html，detail.html中引入这个nav.html导航条模板。

 

　　模板的继承需要使用到extends关键字。

 

　　extends：关键字表明了当前文件index.html所继承的父模板

 

　　继承时会将此文件（当前案例是nav.html文件）的所有代码全部继承。

 

　　在index.html文件中写入如下代码：

 

　　其他两个list.html，detail.html文件同index.html，写入相同的内容。

 

　　7、运行查看

 

　　此时，这三个html都使用了公共的导航条（nav.html文件）。

 

　　8、虽然使用了公共的导航条，但是每个html文件中，此时我们不能加入每个页面的内容（即首页内容，列表页内容，详情页内容），不信，你可以尝试？此时我们在index.html中写入一个h2标签。

 

　　再次刷新网页，发现首页上并没有我们想要的内容。

 

　　原因是我们已经将nav.html中内容固定了，extends继承模板时，将nav.html文件的内容完全引入，替换掉index.html的内容，所以我们自己写的h2标签是不可以运行的。值得注意的是，如果把h2标签放在{% extends ‘nav.html’ %}代码之前，是可以运行显示的，这里不做尝试，望读者自行尝试。

 

　　9、现在我们的需求是index,list,detail的模板文件在渲染后展示不同的内容。但由于这index,list,detail三个模板文件我们现在继承的是nav.html的内容，直接将代码{% extends ‘nav.html’ %}添加在后面又不可以，放在{% extends ‘nav.html’ %}之前又失去了公共导航条的意义。那么现在唯一剩下的解决方案就是更改nav.html，使其能够让我们在不同的模板文件中实现自定义的功能。

 

　　Django为我们提供了一个block标签。如果子模板需要在当前这个页面的基础上，添加一些自己页面的内容，使用django内置的模板标签block（代码块）即可，需要给这个块起一个名称。可以随意起。

 

　　10、现在我们修改nav.html，预留自定义代码的接口。即增加{% block content %} {% endblock %}。

 

　　同时在index.html文件中增加一个自定义的h1标签。

 

　　再次刷新，此时index首页已经发生变化。多出了我们自定义的h1标签。相应的其他两个模板文件的变更与index.html相同，这里不做尝试。

 

　　11、虽然自定义了index首页的内容。但是细心的同学就会发现了一个小小的缺陷。

 

　　那就是打开index首页的选项卡上仍旧显示的是nav.html中的title字段。我们知道，诸如伯乐在线这个网站，每点击导航栏的一个模块，新打开的窗口上的额标题就会发生变化。而我们现在继承了模板，相应的title内容也就写死了。那么该怎么处理呢？

 

　　12、为了方便解决这个问题，我们将nav.html的内容再次做出修改，如下图所示：

 

　　注意：

 

　　在block中设置的标签，就相当于是一个title的默认值。

 

　　如果子模板没有重写这个title块，就使用这个默认值，如果子模板重写了这个title块，就使用子模板的值。

 

　　13、由于我们需要变更index首页的title标题，所以我们需要对index.html的内容再次做出修改。通过block预留的接口，修改我们需要的title。这一点类似于类，我们可以对类进行继承，在继承的同时对其不符合我们需求的进行重写。