编码相关

对工作中遇到相关的编码问题的一个总结。

编码出现的环境

1. 直接显示在页面
2. 在script 标签中
3. 在页面事件中
4. 在innerHTML 的语境
5. 在页面链接的url中
6. 提交url参数处理
7. js 获取url参数值的时候

处理办法

1.对于要显示在页面中的数据，这个时候要防止标签的自闭合，以及属性中单引号和双引号。

• "<" ---> "&lt";
• ">" ---> "&gt";
• ' ---> &quot；
• " ---> &#39；

2.在JavaScript中单引号和双引号中都是表示字符串，并没有什么区别。

• ' ---> '
• " ---> "
• \ ---> \
• / ---> /

3.在页面事件中、在innerhtml的语境中。

这类语境涉及到了页面html和js环境，先进行js转义，然后再进行html转义。

4.页面url中

这类比较复杂，url中本身涉及到很多的特殊字符，此外也会涉及到html 和js 环境中的赋值的情况，
特别注意，url 编码和html的编码是不一样的，见后文附录url编码表和html编码表

1. 在html 和js环境中，需要转义的字符为： ” ，' ，<，>，\ ，/
2. 在其他环境中，需要转义的字符为：+，空格，？，=，&，#， %

这类字符的转义如下：

• ” ---> %22;

• ' ---> %22;

• < ---> %3C

• ">" ---> %3E

• \ ---> %5C

• / ---> %2F

• "+" ---> %2b

• 空格 ---> %20

• ？ ---> %3F

• = ---> %3D

• & ---> %26

• "#" ---> 23

• "%" ---> %25

• 提交url 参数的处理：

• Form表单提交方式：
  不需要做任何处理，表单会依照页面的编码进行编码

• ajax的提交：
  因为ajax的提交的时候，是拼接成url的方式提交给后端的，所以必须要考虑对 +，空格，？，=，&，#， % 的转义，通常使用 encodeURIComponent进行转义

6. js 获取url参数的值的时候

• 得到url中的参数值的时候，首先必须要进行decodeURIComponent的转码才能使用，因为url中的一些特殊字符都经过了编码

• 将url的值设置到一些参数上时，比如隐藏表单上的value值的时候（作提交refer），需要进行encodeURIComponent 编码