原生js实现转义还原HTML

代码

// 使用js实现 转义&还原HTMLconst htmlStr = '<h1 title="123">这是一个h1标题<span>abc&nbsp;</span></h1>';
// 定义转义html的方法
function htmlEscape(htmlStr) {return htmlStr.replace(/<|>|"|&/g, match =>{switch(match) {case '<':return '&lt;';case '>':return '&gt;';case '"':return '&quot;';case '&':return '&amp;';}})
}// 定义还原html的方法
function htmlUnescape(html) {return html.replace(/&lt;|&gt;|&quot;|&amp;/g, match => {switch(match) {case '&lt;':return '<';case '&gt;':return '>';case '&quot;':return '"';case '&amp;':return '&';}})
}// 验证方法的正确性
let html = htmlEscape(htmlStr);
console.log(html);
let str = htmlUnescape(html);
console.log(str);

结果

参考：黑马程序员Node.js全套入门教程，nodejs最新教程含es6模块化+npm+express+webpack+promise等_Nodejs实战案例详解_哔哩哔哩_bilibili

原生js实现转义还原HTML相关推荐

五子棋人机对战_原生JS+Canvas实现五子棋游戏
原生JS+Canvas实现五子棋游戏效果图主要功能模块为: 1.人机对战功能 2.悔棋功能 3.撤销悔棋功能二.代码详解 2.1 人机对战功能实现从效果图可以看到,棋盘的横竖可以放的位置为15 ...
使用原生js写ajax
// 使用原生js 封装ajax // 兼容xhr对象 function createXHR(){if(typeof XMLHttpRequest != "undefined"){ ...
html五子棋游戏制作原理,原生JS+Canvas实现五子棋游戏
功能模块先看下现在做完的效果: 代码详解人机对战功能实现从效果图可以看到,棋盘的横竖可以放的位置为15*15,通过canvas画棋盘: //绘画棋盘 var drawChessBoard = f ...
2048小游戏（原生js基础代码篇）
今天在这里,我将给各位呈现一个简单的游戏代码. 想必大家都接触过2048这个小游戏吧,在悠闲时间用于消遣时间最好不过了,那么,我给大家写一个2048最基本的原生js代码. HTML: <!DOC ...
vue原生js打印插件
##需求在vue单页面应用中打印目标区域 ##解决方案使用原生window.print var printhtml = window.getElementById(dom).innerHtml / ...
使用原生Js实现随机点名
使用原生Js实现随机点名最近学了一点前端内容,老师让用js设计一个班里的随机点名器.就尝试写了一个,具体实现效果如图: 实现代码: <!DOCTYPE html> <html la ...
图片五子棋PHP接口,原生JS+Canvas实现五子棋游戏实例
一.功能模块先看下现在做完的效果: 主要功能模块为: 1.人机对战功能 2.悔棋功能 3.撤销悔棋功能二.代码详解 2.1 人机对战功能实现从效果图可以看到,棋盘的横竖可以放的位置为15*15, ...
html五子棋悔棋,原生 JS + Canvas 实现五子棋游戏
原标题:原生 JS + Canvas 实现五子棋游戏 || 一.功能模块先看下现在做完的效果: 线上体验: https://wj704.github.io/five_game.html 主要功能模块 ...
原生js怎么追加html,原生JS改变HTML内容
最近发现总是把原生JS语法和诸多框架库神马的语法搞混,打算暂时弃用各种库,回归到原生来,好好抠一抠所有的细节,跳一跳各种坑,才能飞得更远.PS. 突然想起冰火里面三眼乌鸦对布兰说的那句话--You'l ...

原生js实现转义还原HTML

代码

结果

原生js实现转义还原HTML相关推荐

最新文章

热门文章

原生js实现 转义还原HTML

代码

结果

原生js实现 转义还原HTML相关推荐

最新文章

热门文章

原生js实现转义还原HTML

原生js实现转义还原HTML相关推荐