HTML编解码说明/在线HTML编解码

encodeHTMl

const encodeHTML = (html: string): string => {
const div = document.createElement('div');
div.textContent = html;
return div.innerHTML;
} const decodeHTML = (html: string): string => {
const div = document.createElement('div');
div.innerHTML = html;
return div.innerText || div.innerHTML;
} const html = '<p>html decode/encode test &</p>';
let encodedHTML = encodeHTML(html);
let decodedHTML = decodeHTML(encodedHTML);
console.log(`raw html: ${html}`);
console.log(`encoded html: ${encodedHTML}`);
console.log(`decoded html: ${decodedHTML}`); console.log(`&amp;&lt;p&gt;aaa&lt;/p&gt;`)

HTML编码(encodeHTMl)

对HTML编码就是对HTML文档中的特殊字符进行编码, 使得浏览器不会将这些内容识别为HTML文档内容;

会变编码的字符如

  • &: &amp
  • <: &lt;
  • >: &gt

HTML解码(decodeHTML)

HTML编码的逆过程, 将HTML中进行过编码的字符恢复为原来的字符

  • &amp: &
  • &lt;: <
  • &gt: >

js实现encodeHTML和decodeHTML的更多相关文章

  1. javascript; JS版HtmlEncode方法,结果与C#中HttpUtility.HtmlEncode方法一样。

    <script type="text/javascript"> function HTMLEncode(html) { var temp = document.crea ...

  2. 彻底解决“从客户端中检测到有潜在危险的Request.Form值”

    类似设置validateRequest="false"的方法不推荐,因为应用程序需要显式检查所有输入,不方便. 1.前端使用encodeHtml函数对字符串进行编码,例: var ...

  3. WEB语言转义总结

    后台字符串嵌入前台语言输出   web语言分为后台和前台,如果后台语言嵌入方式将字符串输出到前台语言中,需要按照前台语言的要求进行转义. 因为前台各个语言都有自身的保留字符, 用于规定自身的语法格式, ...

  4. web安全之XSS攻击原理及防范

    阅读目录 一:什么是XSS攻击? 二:反射型XSS 三:存储型XSS 四:DOM-based型XSS 五:SQL注入 六:XSS如何防范? 1. cookie安全策略 2. X-XSS-Protect ...

  5. 封装自己的Common.js工具库

    Code/** * Created by LT on 2013/6/16. * Common.js * 对原生JS对象的扩展 * Object.Array.String.Date.Ajax.Cooki ...

  6. 用Javascript(js)进行HTML转义工具(处理特殊字符显示)

    转自:http://blog.csdn.net/hj7jay/article/details/51280405  众所周知页面上的字符内容通常都需要进行HTML转义才能正确显示,尤其对于Input,T ...

  7. 添加可运行的js代码

    如何在博客园的文章/随笔中添加可运行的js代码 在博客园浏览大牛们写的文章时,经常会看到在文章中混有一些可运行示例,例如司徒正美的博客中: 带有可运行示例 可以点击“运行代码” 经过一番小小的探索,掌 ...

  8. js转义和反转义html

    本文地址: http://www.cnblogs.com/daysme/p/7100553.html 下面的代码网上常用有,但不是想要的. JS实现HTML标签转义及反转义 http://blog.c ...

  9. js转义和反转义html htmlencode htmldecode

    文章目录 JS实现HTML标签转义及反转义 用Javascript进行HTML转义 1.HTML转义 2.反转义 3.一个有意思的认识 4.完整版本的代码 其他 [转义字符]HTML 字符实体< ...

随机推荐

  1. Java并发包源码学习系列:ReentrantReadWriteLock读写锁解析

    目录 ReadWriteLock读写锁概述 读写锁案例 ReentrantReadWriteLock架构总览 Sync重要字段及内部类表示 写锁的获取 void lock() boolean writ ...

  2. (二)数据源处理2-xlrd操作excel

    import xlrd3workbook = xlrd3.open_workbook('test_data.xlsx')sheet =workbook.sheet_by_name('Sheet1')p ...

  3. Java 基于 mysql-connector-java 编写一个 JDBC 工具类

    用到的 jar 包 jar包地址: mysql-connector-java-5.1.47.jar junit-4.13.jar Maven: <!-- mysql驱动 --> <d ...

  4. 【Linux】E297: Write error in swap file 解决办法

    今天登陆到服务器上,发现通过vi 打开文件就会报错: E297: Write error in swap file E303: Unable to open swap file for "c ...

  5. 实现简易版德州扑克|学习麻瓜编程以项目为导向入门前端 HTML+CSS+JS

    实现简易版德州扑克 1.先上达到网页效果图(简易版德州扑克) 网页分为发牌区和牌池,上面为发牌区,下面是牌池区 2. 代码实现 2.1 HTML和JS代码 ` <link rel="s ...

  6. 手动验证MySQL Innodb RR级别加锁 需要注意的几个点

    记录几个坑 优化器在表行数比较少的时候 会使用全表扫描,会造成全表所有的行加锁,所以需要使用force index 强制使用索引 来实现gap-lock(间隙锁)的应用 next-lock 加锁 会锁 ...

  7. python7、8章

    目录 第七章 用户输入和while循环 7.1 函数input()的工作原理 7.1.1 编写清晰的程序 7.1.2 使用int()来获取数值输入 分析: 结果: 7.1.3 求模运算符 7.1.4 ...

  8. (05)-Python3之--运算符操作

    1.算数运算 num_a = 100 num_b = 5000 # 加法 + print(num_a + num_b) # 减法 - print(num_a - num_b) # 乘法 * print ...

  9. 研发流程 接口定义&开发&前后端联调 线上日志观察 模型变动

    阿里等大厂的研发流程,进去前先了解一下_我们一起进大厂 - SegmentFault 思否 https://segmentfault.com/a/1190000021831640 接口定义 测试用例评 ...

  10. 签名 sign key 纸质邮件 历史 RSA诞生历史

    API接口签名校验,如何安全保存appsecret? - 知乎  https://www.zhihu.com/question/40855191 要保证一般的客户端-服务器通信安全,可以使用3个密钥. ...