Python大神教你300行代码搞定HTML模板渲染「附源码」_随笔

模板语言由HTML代码和逻辑控制代码组成，此处 @PHP 。通过模板语言可以快速的生成预想的HTML页面。应该算是后端渲染不可缺少的组成部分。

通过使用学习 tornado 、 bottle 的模板语言，我也效仿着实现可以独立使用的模板渲染的代码模块，模板语法来自 tornado 和 bottle 的语法。可以用来做一些简单的事情 网页渲染 ， 邮件内容生成 等HTML显示方面。以下就是简单的语法使用介绍。

1. 变量。使用 {{ }} 包裹起来，里面的变量为Python传入。模板渲染时会将传入的变量转换成字符串并填入对应位置。

2. 转义。默认传入的数据都会进行HTML转义，可以使用 {% raw value %} 来将value的内容按原始字符串输出。

3. 条件控制。支持Python的 if，elif，else 。条件代码需要放在 {% %} 内部，并且在条件结束后需要额外增加 {% end %} ，用于标识条件控制语句块范围。

4. 循环控制。支持Python的 for 和 while 。与条件控制一样也需要放在 {% %} 内部，并且结束处需要额外增加 {% end %} ，用于标识循环控制语句块的范围。

这个模板语言模块是在 Python2.7 上面开发使用的，如果要在 Python3+ 上使用需要对 str 和 bytes 进行一些处理即可，由于没有引用任何其他模块，可以很好地独立使用。

原文链接：

http://www.cnblogs.com/jeffxun/p/15585073.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<style>

<!--

body {

background:url(img/bg9.gif)

margin:0px

padding:0px

}

.pic{

border:1px solid #00406c

}

p {

padding-top:30px

color:#001671

}

p.con{

padding-left:4px

padding-right:4px

}

p.title {

paddin-top0px

}

.chara1 {

font-size:12px

background-color:#90bcff

}

.chara1 td{

text-align:center

}

.chara2 {

background-color:#d2e7ff

text-align:center

font-size:12px

vertical-align:top

}

.chara3 {

background:#e9fbff url(img/self.jpg) no-repeat bottom right

vertical-align:top

padding-top:15px

padding-left:30px

font-size:12pxpadding-right:15px

}

-->

</style>

</head>

<body>

</table>

</table>

<tr>

<td width="150px" class="chara2"><p><img src="img/selfpic.jpg" class="pic"/><br />我的日记本</p>

<p class="con">他们彼此深信，是瞬间并发的热情让他们相遇。这样的确定是美丽的，但变幻无常更为美丽。</p>

<p class="con">董事长的一切都让人既羡慕又忌妒，但更让人受不了的是，有一天，上苍忽然赐给他一个神奇的礼物</p> </td>

<p>我努力的抓紧世界，最后却仍被世界淘汰，如果一开始就松手，我会不那么伤心吗？你说，亲爱的孩子，世事难料，随它去吧！</p>

<p>关于童年，你记住了什么？ <br>

两岁时，我拥有一只巨大的粉红猪，它总在我嚎啕大哭时逗我笑。<br>

三岁时，我骑着小木马一路摇到外婆家，它不喝水也不吃草。<br>

四岁时，我离家出走，在公车上睡着了，最后是太空超人送我回家。<br>

我真的没骗你，我通通都记得，还有照片为证。

</p>

<p>天使在地下铁的入口，<br>

和我说再见的那一年，<br>

我渐渐看不见了。<br>

十五岁生日的那年秋天早晨，<br>

窗外下着毛毛雨，<br>

我喂好我的猫。<br>

六点零五分，<br>

我走进地下铁。</p>

<h4>向左走向右走</h4>

<p>They're both convinced<br>

that a sudden passion joined them.<br>

Such certainth is beautiful,<br>

but uncertainty is more beautiful still.</p>

<br>

</td>

</tr>

</table>

</body>

</html>

这种模板很多的，百度打开一个网页右键源代码就能找到了。

<title>{dede:global.cfg_webname/}</title>

html,

body {

margin: 0

padding: 0

}

.iw_poi_title {

color: #CC5522

font-size: 14px

font-weight: bold

overflow: hidden

padding-right: 13px

white-space: nowrap

}

.iw_poi_content {

font: 12px arial, sans-serif

overflow: visible

padding-top: 4px

white-space: -moz-pre-wrap

word-wrap: break-word

}

</style>

jQuery(document).ready(function() {

jQuery('#openSidebar').click(function() {

jQuery('.wrapper').toggleClass('openNav')

})

jQuery('#menu a').click(function() {

jQuery('.wrapper').removeClass('openNav')

})

</script>

html,

body,

wrapper {

height: 100%

}

</style>

</head>

<body>

</div>

</li>

<li><a href="#services" class="nav_services"><span>服务范围<br /><b>Services</b></span></a>

</li>

</li>

<li><a href="#about" class="nav_about"><span>关于我们<br /><b>About us</b></span></a>

</li>

</li>

<li><a href="#contact" class="nav_contact"><span>联系我们<br /><b>Contact us</b></span></a>

</li>

</ul>

</div>

</div>

</div>

</div>

</div>

{dede:global.cfg_ggg/}

</div>

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/zaji/7195289.html

Python大神教你300行代码搞定HTML模板渲染「附源码」

发表评论

评论列表（0条）