兼容ie8（很实用，复制过来，仅供技术参考，更详细内容请看源地址：http://www.cnblogs.com/iyangyuan/archive/2013/12/12/3471227.html）

<!DOCTYPE html>

<html>

  <head>

    <META http-equiv=Content-Type content="text/html; charset=utf-8">

    <title>关于HTML编码 - by 杨元</title>

  </head>

  <body>

    <h1>关于HTML编码</h1>

    <!--基础html框架-->

    <table>

      <thead>

        <tr>

          <th>姓名</th>

          <th>性别</th>

          <th>年龄</th>

          <th>个人主页</th>

        </tr>

      </thead>

      <tbody id="tableList">

      </tbody>

    </table>

    <!--插件引用-->

    <script type="text/javascript" src="script/jquery.js"></script>

    <script type="text/javascript" src="script/handlebars-1.0.0.beta.6.js"></script>

    <!--Handlebars.js模版-->

    <!--Handlebars.js模版放在script标签中，保留了html原有层次结构,模版中要写一些操作语句-->

    <!--id可以用来唯一确定一个模版,type是模版固定的写法-->

    <script id="table-template" type="text/x-handlebars-template">

      {{#each student}}

        <tr>

          <td>{{name}}</td>

          <td>{{sex}}</td>

          <td>{{age}}</td>

          {{#compare age 20}}

            <td>{{homePage}}</td>

          {{else}}

            <td>{{{homePage}}}</td>

          {{/compare}}

        </tr>

      {{/each}}

    </script>

    <!--进行数据处理、html构造-->

    <script type="text/javascript">

      $(document).ready(function() {

        //模拟的json对象

        var data = {

                    "student": [

                        {

                            "name": "张三",

                            "sex": "0",

                            "age": 18,

                            "homePage":"<a href='javascript:void(0);'>张三的个人主页</a>"

                        },

                        {

                            "name": "李四",

                            "sex": "0",

                            "age": 22,

                            "homePage":"<a href='javascript:void(0);'>李四的个人主页</a>"

                        },

                        {

                            "name": "妞妞",

                            "sex": "1",

                            "age": 19,

                            "homePage":"<a href='javascript:void(0);'>妞妞的个人主页</a>"

                        }

                    ]

                };

        //注册一个Handlebars模版，通过id找到某一个模版，获取模版的html框架

        //$("#table-template").html()是jquery的语法，不懂的童鞋请恶补。。。

        var myTemplate = Handlebars.compile($("#table-template").html());

        //注册一个比较数字大小的Helper,有options参数，块级Helper

        Handlebars.registerHelper("compare",function(v1,v2,options){

          //判断v1是否比v2大

          if(v1>v2){

            //继续执行

            return options.fn(this);

          }else{

            //执行else部分

            return options.inverse(this);

          }

        });

        //将json对象用刚刚注册的Handlebars模版封装，得到最终的html，插入到基础table中。

        $('#tableList').html(myTemplate(data));

      });

    </script>

  </body>

</html>

通过{{}}取出来的内容，都会经过编码，也就是说，如果取出的内容中包含html标签，会被转码成纯文本，不会被当成html解析，实际上就是做了类似这样的操作：把<用&lt;替代。

这样做是很好的，既可以显示html代码，又可以避免xss注入。这个功能在做代码展示的时候是非常有用的。

但是有时候我们可能需要解析html，不要转码，很简单，把{{}}换成{{{}}}就可以啦。

使用jQuery+huandlebars防止编码注入攻击的更多相关文章

  1. HTML5 App的代码注入攻击

    原文链接 摘要 基于HTML5的手机app(译者注:以下简称HTML5 app)越来越流行了, 在大多数情况下它比native应用更容易适配不同的移动操作系统.它开发起来很方便,可以使用标准的web技 ...

  2. 实例讲解 SQL 注入攻击

    这是一篇讲解SQL注入的实例文章,一步一步跟着作者脚步探索如何注入成功,展现了一次完整的渗透流程,值得一读.翻译水平有限,见谅! 一位客户让我们针对只有他们企业员工和顾客能使用的企业内网进行渗透测试. ...

  3. PHP函数 addslashes() 和 mysql_real_escape_string() 的区别 && SQL宽字节，绕过单引号注入攻击

    首先:不要使用 mysql_escape_string(),它已被弃用,请使用 mysql_real_escape_string() 代替它. mysql_real_escape_string() 和 ...

  4. PHP邮件注入攻击技术

    1. 简介 如 今,互联网的使用急剧上升,但绝大多数互联网用户没有安全知识背景.大多数的人都会使用互联网通过邮件Email的方式和他人进行通信.出于这个原因,大 多数网站允许他们的用户联系他们,向网站 ...

  5. SQL注入攻击

    SQL注入攻击是黑客对数据库进行攻击的常用手段之一.随着B/S模式应用开发的发展,使用这种模式编写应用程序的程序员也越来越多.但是由于程序员的水平及经验也参差不齐,相当大一部分程序员在编写代码的时候, ...

  6. ADO.NET笔记——SQL注入攻击

    相关知识: 可以通过字符串的拼接来构造一个SQL命令字符串,但是SQL命令字符串的拼接确是造成“SQL注入攻击”的重要原因. 考虑下列例子:从ProductCategory表中检索出Name为“Bik ...

  7. SQL注入攻击的种类和防范手段

    观察近来的一些安全事件及其后果,安全专家们已经得到一个结论,这些威胁主要是通过SQL注入造成的.虽然前面有许多文章讨论了SQL注入,但今天所讨论的内容也许可帮助你检查自己的服务器,并采取相应防范措施. ...

  8. Yii防注入攻击笔记

    网站表单有注入漏洞须对所有用户输入的内容进行个过滤和检查,可以使用正则表达式或者直接输入字符判断,大部分是只允许输入字母和数字的,其它字符度不允许:对于内容复杂表单的内容,应该对html和script ...

  9. mysql注入攻击及防范

    一.注入攻击种类     1. GET注入         输入参数通过URL发送.     2. POST注入         输入参数通过HTTP正文发送     3. COOKIE注入      ...

随机推荐

  1. LINUX系统配置

    LINUX系统配置 Linux 安装jdk方法; Linux Tomcat 安装与配置 Linux redis 安装与配置 (例1) Linux redis安装配置(例2) NGINX 安装 Linu ...

  2. Python学习之路基础篇--01Python的基本常识

    1 计算机基础 首先认识什么是CPU(Central Processing Unit),即中央处理器,相当于人类的大脑.内存,临时储存数据,断电即消失.硬盘,可以长久的储存数据,有固态硬盘,机械硬盘之 ...

  3. 服务器-华为RH5885 V3-安装Windows Server 2008R2后设备管理器中存在大量的感叹号，并且无法识别网络适配器，没有网卡

    问题描述:用引导盘安装Windows Server 2008R2后,出现如题的情况. 根源:驱动未安装. 解决方法: 1.下载驱动:https://support.huawei.com/enterpr ...

  4. PythonStudy——Python 内存池机制 (Memory pool mechanism) Pymalloc

    Python是如何进行内存管理-内存池机制 Pymalloc Python引用了一个内存池(memory pool)机制,即Pymalloc机制(malloc:n.分配内存),用于对小块内存的申请和释 ...

  5. python, ImageFont

    ImageFont模块定义了相同名称的类,即ImageFont类.这个类的实例存储bitmap字体,用于ImageDraw类的text()方法. PIL可以配置是否支持TrueType和OpenTyp ...

  6. 3.2-1937 Problem D

    #include <stdio.h> ; }; }; int main(void) { int n; while(scanf("%d", &n) != EOF) ...

  7. zabbix之 自定义(指定特定磁盘)监控io

    引言 zabbix自带的模板,并且完成了我们的一些比较常用的监控,现在我们如果想要监控我们磁盘的IO,这时候zabbix并没有给我们提供这么一个模板,所以我们需要自己来创建一个模板来完成磁盘IO的监控 ...

  8. 乐乐课堂_leleketang.com

    乐乐课堂_leleketang.com https://www.baidu.com/sf?pd=video_page&sign=12394301609542619800&word=抛物 ...

  9. linux-linnode满了的提示

    线上有一台web服务器磁盘检测告警了,提示空间不足,登到服务器查看 <ignore_js_op> touch:cannot touch `furm.html': No space left ...

  10. 【Python】断言功能Assertion

    转自 https://www.cnblogs.com/cicaday/p/python-assert.html Python Assert 为何不尽如人意 Python中的断言用起来非常简单,你可以在 ...