第一个常用内置转换器: $.views.converters.html()
$.views.converters.html()是内置的HTML编码器,像这样使用:
var myHtmlEncodedString = $.views.converters.html(myString);
除了这种方式外,也可以使用如下的两种方式来声明一个converter
{{html:myExpression}} {{>myExpression}}
实际上{{>...}}和{{html...}}的功能是完全一样的,只是提供了一种更为简单的方式来编码HTML。
实例:
<!DOCTYPE html> <html> <head> <link href="../css/samples.css" rel="stylesheet"/> <script src="../jquery/jquery-2.0.3.js"></script> <script src="../jsviews/jsviews.js"></script> </head> <body> <button id="show">Show result</button> <script> var value = "< > ' \" &"; var result = $.views.converters.html(value); $("#show").on("click", function() { alert(result); }); </script> </body> </html>
HTML的encode规则:
& → &
< → <
> → >
\x00 → �
' → '
" → "
` → `
============================================================================
第二个常用的内置转换器:$.views.converters.attr()
如果需要对属性进行encode的时候,就可以使用该转换器。像这样使用:
var myAttributeEncodedString = $.views.converters.attr(myString);
除此之外,还可以这样使用:
{{attr:myExpression}}
实例:
<!DOCTYPE html> <html> <head> <link href="../css/samples.css" rel="stylesheet"/> <script src="../jquery/jquery-2.0.3.js"></script> <script src="../jsviews/jsviews.js"></script> </head> <body> <button id="show">Show result</button> <script> var value = "< > ' \" &"; var result = $.views.converters.attr(value); $("#show").on("click", function() { alert(result); }); </script> </body> </html>
1. 实际上{attr: ...}} and {{html: ...}}具有相同的功能。
2. 这样使得当HTML需要encode时,可以对attribute进行encode,从而可以避免未信任数据的危险注入。
3. 使用下面的schema进行encode:
& → &
< → <
> → >
\x00 → �
' → '
" → "
` → `
============================================================================
第三个有用的内置转换器:$.views.converters.url()
该转换器主要用于对url进行encode,可以这样使用:
var myUrlEncodedString = $.views.converters.url(myString)
除此之外,也可以使用这样的方式来声明该转换器:
{{url:myExpression}}
<!DOCTYPE html> <html> <head> <link href="../css/samples.css" rel="stylesheet"/> <script src="../jquery/jquery-2.0.3.js"></script> <script src="../jsviews/jsviews.js"></script> </head> <body> <button id="show">Show result</button> <script> var value = "<_>_\"_ "; var result = $.views.converters.url(value); $("#show").on("click", function() { alert(result); }); </script> </body> </html>