转义字符的通用处理方式

 

1       背景

文章内容或者文章标题一般来说都可以含有一些特殊的字符,如:

原始字符

转义字符

"&"

"&"

"<"

"&lt;"

">"

"&gt;"

"\""

"&quot;"

如果这些字符直接显示在html中,如显示在<div></div>中,就会破坏原有的html的结构,导致html页面不能正确显示。如下例子:

<p>

<img src="upload123.jpg">

<test>abcd</test>

</p>

在浏览器中是不会显示内容:<test>abcd</test>,因为浏览器碰到不能识别的标签会自动忽略。因此需要test中相关的内容就需要转义:

<p>

<img src="upload123.jpg">

&lt;test&gt;abcd&lt;/test&gt;

</p>

 

2       处理方式

2.1     什么时候转义

一般来说存储在持久层(如数据库中)的数据需要保存原始的字符,即不进行转义。然后在前端页面渲染的时候进行转义。

但是某些编辑器编辑的时候就自动转义,即发送给后端的就是转义后的字符。如CKEditor



 

 

 

对于这样的编辑器直接将数据库中获取到的转义后的数据赋给编辑器即可。它会自动处理。

但是不能采用如下方式:

CKEDITOR.replace('editor1',{customConfig : 'root/resources/js/ckeditor_config.js'} );

即如果:

<textarea cols="80" id="editor1" name="contents" rows="10">&lt;test&gt;abcd&lt;/test&gt;

</textarea>

在编辑器中还是显示不是test的内容的。必须使用setData的方式。

CKEDITOR.instances.editor1.setData(‘&lt;test&gt;abcd&lt;/test&gt;’);

2.2     编辑时如何处理

一般内容的编辑时在input或者是textarea中进行编辑。如果直接给它赋值转义后的字符,它会自动的在编辑框中显示原始的字符。因此一般来说不需要特殊处理。

:

<input type=”text” value=” &lt;test&gt;abcd&lt;/test&gt;”>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值