Django Web开发学习笔记(4)
第四章 模板篇
上一章的内容,我们将HTML的代码和Python代码都混合在了在view.py的文件下。但是这样做的坏处无疑是明显的,引用DjangoBook的说法:
对页面设计进行的任何改变都必须对 Python 代码进行相应的修改。 站点设计的修改往往比底层 Python 代码的修改要频繁得多,因此如果可以在不进行 Python 代码修改的情况下变更设计,那将会方便得多。
Python 代码编写和 HTML 设计是两项不同的工作,大多数专业的网站开发环境都将他们分配给不同的人员(甚至不同部门)来完成。 设计者和HTML/CSS的编码人员不应该被要求去编辑Python的代码来完成他们的工作。
程序员编写 Python代码和设计人员制作模板两项工作同时进行的效率是最高的,远胜于让一个人等待另一个人完成对某个既包含 Python又包含 HTML 的文件的编辑工作。
这一章我们采用Template的方法来尽量将两部分代码进行分离。
一、引入模板模块
在view.py中导入模块
from django.template import Template,Context
其中,Template模块是负责HTML的模板操作,Context是负责前端界面的显示任务。
二、创建模板
1.<html>
2.<body>
3.{% ifequal passport 'ywc'%}
4.name:{{userName}},passport:{{passport}}
5.{% else %}
I6.input Error,please try it again......
7.</body>
8.</html>
9.{% endifequal %}
其中需要明白两个新引入的变量的概念
{% %}称为模板标签,下面我们将会列举出开发中使用的大部分标签,功能类似于JSP中的标签,我们甚至可以创建自己的标签。
{{ }}称为模板变量,我们在JSP开发中使用的是${}来获取从Servlet传递过来的数据,用于在前端展示
上面的代码的是判断passport是否等于'ywc' 如果相等的话就会把用户名和密码都显示在界面上,如果不等的话则会提示“input error......”的字符串。
我们在view.py中定义这样一个函数:
def template_20140627(request):h = """<html><body>{% ifequal passport '123'%}name:{{userName}},passport:{{passport}}{% else %}Input Error,please try it again......</body></html>{% endifequal %}"""t = Template(h);c = Context({'userName':'ywc','passport':'123'})html = t.render(c);return HttpResponse(html)
如上,我们将完成了在视图端的基本操作。用户的姓名为'ywc',密码为123.判断用户密码如果为123的话就输出用户名和用户密码,否则的话输出错误提示!
三、添加映射路径
在urls.py中添加如下:
(r'^tt/$', DjangoE_1.view.template_20140627)
在浏览器中输入访问地址http://localhost:8000/tt/就能看到我们的结果。
经过上面的操作,我们发现HTML代码依然被嵌入在view.py中,并没有实现分离的效果。其实,我们发现,最终显示在网页上的是response返回的字符串,因此,我们可以直接将模板单独放在一个文件夹下面,通过打开文件来获取该模板。我们在工程目录下新建一个名为template的文件夹。并将前面定义的模板teml.html放在该文件夹下面.
1、定义模板
<html><body>{% ifequal passport '123'%}name:{{userName}},passport:{{passport}}{% else %}Input Error,please try it again......</body>
</html>{% endifequal %}
2、在view.py 中定义函数
def template_20140628(request):fp = open(r'C:\Python27\project\DjangoE_1\template\temp.html','r')t = Template(fp.read())fp.close()html = t.render(Context({'userName':'ywc','passport':'123'}))return HttpResponse(html
3、在urls.py中添加链接
(r'^tt2/$', DjangoE_1.view.template_20140628),
重新在浏览器内输入浏览地址,我们可以看到和上面的浏览器输出一个结果
同样,根据Python的DRY原则,上述代码依旧不够简洁,DjangoBook给出的解释如下:
它没有对文件丢失的情况做出处理。 如果文件 mytemplate.html 不存在或者不可读, open() 函数调用将会引发 IOError 异常。
这里对模板文件的位置进行了硬编码。 如果你在每个视图函数都用该技术,就要不断复制这些模板的位置。 更不用说还要带来大量的输入工作!
它包含了大量令人生厌的重复代码。 与其在每次加载模板时都调用 open() 、 fp.read() 和 fp.close() ,还不如做出更佳选择。
Django给我们提供了一个get_template()函数可以从直接加载模板而不用每次都Open()该模板
1、在我们的setting.py中可以加载这样一个元组
STATIC_URL = '/static/'
TEMPLATE_DIRS = (r'C:\Python27\project\DjangoE_1\template',
)
这就是我们的模板加载的路径 2、在view.py中定义如下函数:加载模块:from django.template.loader import get_template
def template_20140629(request):t = get_template('temp.html');html = t.render(Context({'userName':'ywc','passport':'123'}))return HttpResponse(html)
3、在urls.py中添加下面的语句: (r'^tt3/$', DjangoE_1.view.template_20140629) 在浏览器中输入地址,我们可以获得对应的界面。在这个过程中,我们可能会发现很对url地址的问题。在开发的过程中,由于操作系统的问题,路径中的\和/是不同的。python引入了join函数,具体的可以参考python手册。
Django Web开发学习笔记(4)相关推荐
- Web 开发学习笔记(1) --- 搭建你的第一个 Web Server
简介 Flask 是一个轻量级的 Web 框架, 如果要学习 Web 开发, Flask 非常适合作为我们学习的起点. 通过接下来的这一些列的博客, 我们将学习如何利用 Flask 以及其他工具, 搭 ...
- 【web开发学习笔记】Structs2 Result学习笔记(三)带參数的结果集
Result学习笔记(三)带參数的结果集 第一部分:代码 //前端 <head> <meta http-equiv="Content-Type" content= ...
- Web 开发学习笔记——关于互联网和互联网应用
作为一名前端开发者,了解互联网和浏览器的相关知识是极其有必要的,因为我们所有开发出来的网站全部以互联网和浏览器为基础的. 关于互联网 互联网到底是什么?对于网站普通用户来说,它可能就是宽带.购物网站. ...
- Django web框架学习笔记
Django1.11.4 版本支持Python3.5 3.6 1.Django安装 pip install django==1.11.4 2.验证是否安装成本 python import django ...
- flask web如何加载html,Flask Web开发学习笔记(三)
本文主要整理下几个Flask扩展: 0.Flask-Bootstrap:集成Twitter开发的一个开源框架Bootstrap. 1.Flask-Script:为Flask程序添加一个命令行解析器 2 ...
- Web 开发学习笔记(6) --- 前端开发之 HTML5
前言 通过之前的文章, 我们已经搭好了 webapp 的雏形, 不过到目前为止, 我们的前端界面比较简单, 为此, 我们要学习前端的知识, 然后对界面进行改进. 前端的内容可以分为 HTML CSS ...
- 【web开发学习笔记】Structs2 Action学习笔记(一个)
1.org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter准备和运行 2. <filter-mapping&g ...
- 移动Web开发--学习笔记三 响应式项目实战(微金所)
响应式项目实战(微金所) 响应式项目开发流程 选择一种屏幕格式进行开发 相应功能模块完成后,测试是否响应式效果 确保响应式效果满足要求 进行下一个功能模块开发 使用自定义字体图标 创建自己的字体图标h ...
- Web开发学习笔记:ngIf中使用方法判断字符串中是否包含子字符串
<p *ngFor="let item of UseTypes"><ion-select-option *ngIf="globalVariable.is ...
最新文章
- bzoj 4557: [JLoi2016]侦察守卫 树归
- UA MATH636 信息论7 高斯信道
- 现代软件工程 作业 1 个人项目
- python处理多种编码格式的txt文件
- 自学篇之----html的所有input标签 以及post和get提交之间的区别
- android style 与theme的区别
- 共享onload事件
- 使用Web界面登陆vSphere
- mysql-bin position_MySQL基于binlog-position的复制
- 将日期转换成大写例如:二零一三年十二月
- Basic4Android简单教程(从安装到编译部署到手机)
- 计算机毕业设计、课程设计、实战项目之[含论文+答辩PPT+任务书+中期检查表+源码等]基于ssm的NBA球队管理系统
- 中级软件设计师知识点总结
- SAR图像:拟合杂波时常用的分布
- OCR识别技术之—车牌识别
- python 与_Python爬取拉勾网python职位数据
- Scrum如何拥抱变化
- 计算机函数说课ppt,《excel公式与函数》说课稿
- 随机过程(1.3)—— 随机变量的特征函数
- Java多线程通信-CyclicBarrier(栅栏)
热门文章
- Hubble.net 简介及与Lucene.net 对比测试
- ASP.Net中让网页“立即过时”
- 开源Pravega架构解析:如何通过分层解决流存储的三大挑战?
- javascript设计模式与开发实践(二)- 封装和原型模式
- [摘录]第二部分 战略决策(2)
- 关于网络上的各种mysql性能测试结论
- Emacs中的RSS阅读器--newsticker
- 揭秘:倒卖火车票的惊人黑幕全过程!
- Vue.js 使用 Swiper.js 在 iOS 11 时出现错误
- 熟悉常用的HDFS操作