Django之模板渲染
Posted Python
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Django之模板渲染相关的知识，希望对你有一定的参考价值。
前言
Django的工作流程
1、客户端发送请求到达 URL
2、URL把客户端请求转发给请求函数
3、视图函数 使用原生SQL或者ORM去数据库拿到数据 和模板（HTML文件）二者进行渲染（模板+数据）
4、return 返回给客户端
在使用WEB框架时 把数据库、程序生成 的数据显示在前端，就需要在后台把此类数据填充进HTML中进而return给用户展示；（这种交融行为。。。。被淫王雅称 模板渲染 ）
（模板渲染就 是数据加工，这个工作是在服务端完成后 return给前端的）
一、模板中的特殊标记：
1、数据
{{ 视图函数传入的参数 }}
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <p>{{args}}</p> <p>{% url "zhangge" i i1%}</p> </body> </html>
列表取值：{{列表}}.索引取值
{{users.0}} {{users.1}}
字典取值：{{字典}}.键
<td>{{ row.id }}</td>
2、Django模板标记，还支持流程控制哦！
for循环
{% for row in list %} </tr> <td>{{ row.id }}</td> <td>{{ row.name }}</td> <td>{{ row.title }}</td> <td><a href="#" onclick="show_modal(this)">添加</a></td> <td id="del_s"><a href="#" onclick="modal_del(this)">删除</a> </td> <td><a href="#"onclick="modal_edit(this)">编辑</a></td> </tr> {% endfor %}
if else条件判断
<select name="class_id" id=""> {% for row in dict %} {% if row.id == name1.class_id %} <option selected value="{{ row.id }}">{{ row.title}}</option> {%else%} <option value="{{ row.id }}">{{ row.title}}</option> {%endif%} {% endfor %} </select>
in 成员关系判断
<p>任教课程： <select name="class_id" multiple size="5"> {% for row in clas %} {% if row.id in cids%} <option selected value={{ row.id}}>{{ row.title}}</option> {%else%} <option value={{ row.id}}>{{ row.title}}</option> {% endif %} {% endfor %} </select> </p>
二、母版渲染
在母版定义块，子版继承母版的block和子版形成包含的关系; (原来开发个网站这么 煎蛋，套别写好的母版呗！)
加载时：把母版拿过来替换子版在进行渲染；
1、在母版定义内容：
<html lang="en">
<head>
{% block css %}
</head>
<body>
{% block xx %}
</body>
{% block js %}
</html> 酱紫每个子版就可以延伸出自己的 css 、内容、JS；
2、子版使用母版中定义的 block
{%extends ‘layout.html‘%} <!DOCTYPE html> <html lang="en"> <head> {%block css %} <meta charset="UTF-8"> <title>多对多</title> <script src="/static/zhanggen.js"></script> <style> .shadow{ position: fixed; left: 0; right: 0; top:0; bottom: 0; background-color: black; opacity: 0.8; z-index: 999; } .modal2{ width: 400px; height: 300px; z-index: 1000; margin-left: 420px; margin-top: 50px; background-color:silver; } .haid{ display: none; } </style> {% endblock css %} </head> <body> {%block xx %} <table cellspacing="15"> <th>ID</th><th>老师姓名</th><th>任教班级</th><th colspan="3">操作</th> {% for row in list %} <tr> <td>{{ row.tid }}</td> <td>{{ row.tname }}</td> <td> {% for ri in row.titles %} {{ri}} {% endfor %} </td> <td><a href="#" onclick="return add(this)">添加</a></td> <td><a href="/modal_edit/?tid={{row.tid }}"> 编辑</a></td> <td><a href="/modal_del/?tid={{ row.tid }}">删除</a> </tr> {% endfor %} </table> <div id="1" class="shadow haid "> <div class="modal2"> <p>老师姓名：<input id="tname" type="text"></p> <p>任教班级： <select id="2" multiple="multiple"> {% for row in class_list %} <option value="{{ row.id }}">{{ row.title }}</option> {% endfor %} </select> </p> <input id="3" type="button" value="提交"> <input id="4" type="button" value="取消"> </div> </div> {%endblock xx %} </body> {% block js %} } <script> function add(self) { $("#1").removeClass("haid") $(‘#4‘).click(function () { location.reload() }) $(‘#3‘).click(function () { class_id=$(‘#2‘).val() name=$("#tname").val() {# console.log(name=$("#tname").val())#} $.ajax({ url:"/modal_add/", type:‘POST‘, data:{"cid":class_id,"tname":name}, {# 不加 traditiona jQuery会对列表进行特殊处理#} traditional:true, dataType:‘JSON‘, success:function(data){ if (data.status==true){location.reload()} else {alert(data.status);location.reload()} } {# if (data==‘OK‘){location.reload()}}#} }) }) return false } </script> {% endblock js %} </html>
以上是关于Django之模板渲染的主要内容，如果未能解决你的问题，请参考以下文章