快捷導(dǎo)航

js處理網(wǎng)頁編輯器轉(zhuǎn)義、去除轉(zhuǎn)義、去除HTML標(biāo)簽的正則

更新時(shí)間：2020年02月20日 17:06:53 投稿：mdxy-dxy

這篇文章主要介紹了富文本編輯器生成的HTML標(biāo)簽，進(jìn)行轉(zhuǎn)義，然后寫入數(shù)據(jù)庫，防止腳本注入,需要的朋友可以參考下

富文本編輯器生成的HTML標(biāo)簽，進(jìn)行轉(zhuǎn)義，然后寫入數(shù)據(jù)庫，防止腳本注入：

function htmlEncode(value){
　　return $('<div/>').text(value).html();
}

1、從數(shù)據(jù)庫拿出的轉(zhuǎn)義后的HTML標(biāo)簽內(nèi)容，先得去除轉(zhuǎn)義，然后再去除HTML標(biāo)簽，是生成縮略文字。

/*移除HTML標(biāo)簽代碼*/
 function removeHTMLTag(str) {
   str = str.replace(/<\/?[^>]*>/g,''); //去除HTML tag
   str = str.replace(/[ | ]*\n/g,'\n'); //去除行尾空白
   //str = str.replace(/\n[\s| | ]*\r/g,'\n'); //去除多余空行
   str=str.replace(/ /ig,'');//去掉 
   return str;
 }
 //轉(zhuǎn)意符換成普通字符
 function escape2Html(str) { 
  var arrEntities={'lt':'<','gt':'>','nbsp':' ','amp':'&','quot':'"'}; 
  return str.replace(/&(lt|gt|nbsp|amp|quot);/ig,function(all,t){return arrEntities[t];}); 
 }

如果是文章詳情頁的話，直接去除轉(zhuǎn)義就可以顯示在頁面了：

 //轉(zhuǎn)意符換成普通字符
 function escape2Html(str) { 
  var arrEntities={'lt':'<','gt':'>','nbsp':' ','amp':'&','quot':'"'}; 
  return str.replace(/&(lt|gt|nbsp|amp|quot);/ig,function(all,t){return arrEntities[t];}); 
 }

2、JS正則過濾（去除）富文本編輯器中的FONT-SIZE標(biāo)簽

var test=test.replace(/font-size:\w+;?/g,'');

3、js處理去掉富文本編輯的html，樣式，只顯示純文字內(nèi)容，以供列表頁使用

<script type="text/javascript">
var description = '<p style="margin-top:19.5pt;margin-right:0cm;margin-bottom:19.5pt;margin-left: 0cm;text-indent:24.1pt;mso-char-indent-count:2.0;mso-pagination:widow-orphan"> <b><span lang="EN-US" style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">1.</span></b><b><span style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">國(guó)際保險(xiǎn)經(jīng)紀(jì)行業(yè)收入分析<span lang="EN-US"><o:p></o:p></span></span></b></p> <p style="margin-top:19.5pt;margin-right:0cm;margin-bottom:19.5pt;margin-left: 0cm;text-indent:24.0pt;mso-char-indent-count:2.0;mso-pagination:widow-orphan"> <span lang="EN-US" style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">2010</span><span style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">年全球保險(xiǎn)經(jīng)紀(jì)行業(yè)市場(chǎng)規(guī)模為<span lang="EN-US">437.56</span>億美元，<span lang="EN-US">2015</span>年增長(zhǎng)至<span lang="EN-US">581.3</span>億美元。<span lang="EN-US"><o:p></o:p></span></span></p> <p align="center" style="margin-top:19.5pt;margin-right:0cm;margin-bottom:19.5pt; margin-left:0cm;text-align:center;mso-pagination:widow-orphan"> <span lang="EN-US" style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">2010-2015</span><span style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">年國(guó)際保險(xiǎn)經(jīng)紀(jì)行業(yè)市場(chǎng)規(guī)模：億美元</span></p> <p style="margin: 19.5pt 0cm; text-indent: 24.1pt; text-align: center;"> <img alt="" src="/baoxian/userfiles/1/images/back/news/2018/01/11.png" style="width: 493px; height: 296px;" /></p> <p style="margin-top:19.5pt;margin-right:0cm;margin-bottom:19.5pt;margin-left: 0cm;text-indent:24.1pt;mso-char-indent-count:2.0;mso-pagination:widow-orphan"> <b><span lang="EN-US" style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">2.</span></b><b><span style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">國(guó)際保險(xiǎn)經(jīng)紀(jì)行業(yè)并購分析<span lang="EN-US"><o:p></o:p></span></span></b></p> <p style="margin-top:19.5pt;margin-right:0cm;margin-bottom:19.5pt;margin-left: 0cm;text-indent:24.0pt;mso-char-indent-count:2.0;mso-pagination:widow-orphan"> <span style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">保險(xiǎn)經(jīng)紀(jì)公司并購較為頻繁，<span lang="EN-US">2011</span>年并購數(shù)量為<span lang="EN-US">351</span>件，且呈現(xiàn)增長(zhǎng)趨勢(shì)。一股保險(xiǎn)行業(yè)的并購風(fēng)潮正席卷全球各個(gè)市場(chǎng)。如意大利投資集團(tuán)<span lang="EN-US">Exor</span>收購再保險(xiǎn)公司<span lang="EN-US">PartnerRe</span>、韜睿惠悅與韋萊集團(tuán)、韋萊與法國(guó)保險(xiǎn)經(jīng)紀(jì)公司<span lang="EN-US">GrasSavoye</span>、瑞士保險(xiǎn)集團(tuán)<span lang="EN-US">ACE</span>并購<span lang="EN-US">Chubb</span>以及美國(guó)保險(xiǎn)公司<span lang="EN-US">Anthem</span>收購<span lang="EN-US">Cigna</span>。而這些不過是近年來保險(xiǎn)業(yè)并購案清單的一小部分。<span lang="EN-US"><o:p></o:p></span></span></p> <p style="margin-top:19.5pt;margin-right:0cm;margin-bottom:19.5pt;margin-left: 0cm;text-indent:24.0pt;mso-char-indent-count:2.0;mso-pagination:widow-orphan"> <span style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">然而，在熱鬧喧囂的并購消息背后卻是嚴(yán)酷的現(xiàn)實(shí)。波士頓咨詢（<span lang="EN-US">BCG</span>）對(duì)<span lang="EN-US">1990</span>～<span lang="EN-US">2014</span>年間<span lang="EN-US">778</span>件涉及保險(xiǎn)業(yè)的并購案進(jìn)行了分析，對(duì)并購后一年內(nèi)的股東總回報(bào)進(jìn)行了追蹤，最終發(fā)現(xiàn)只有<span lang="EN-US">51%</span>的并購能實(shí)際創(chuàng)造價(jià)值，而<span lang="EN-US">49%</span>的并購案則摧毀了公司的價(jià)值。近半數(shù)并購案失敗可歸咎為三大原因：并購準(zhǔn)備和執(zhí)行、并購后整合以及并購時(shí)機(jī)。<span lang="EN-US"><o:p></o:p></span></span></p> <p style="margin-top:19.5pt;margin-right:0cm;margin-bottom:19.5pt;margin-left: 0cm;text-indent:24.1pt;mso-char-indent-count:2.0;mso-pagination:widow-orphan"> <b><span lang="EN-US" style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">3.</span></b><b><span style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">保險(xiǎn)業(yè)持續(xù)大整合<span lang="EN-US"><o:p></o:p></span></span></b></p> <p style="margin-top:19.5pt;margin-right:0cm;margin-bottom:19.5pt;margin-left: 0cm;text-indent:24.0pt;mso-char-indent-count:2.0;mso-pagination:widow-orphan"> <span style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">未來<span lang="EN-US">5</span>年，多個(gè)宏觀層面的因素將繼續(xù)推動(dòng)保險(xiǎn)業(yè)進(jìn)行整合。首先是監(jiān)管繼續(xù)收緊，尤其是對(duì)資本充足率的要求將繼續(xù)提升，無論是獨(dú)立保險(xiǎn)商還是綜合集團(tuán)都將感到更大的資金壓力。利率和投資回報(bào)將繼續(xù)保持較低水平（至少在成熟市場(chǎng)），使傳統(tǒng)的壽險(xiǎn)業(yè)務(wù)盈利能力受到限制。<span lang="EN-US"><o:p></o:p></span></span></p> <p style="margin-top:19.5pt;margin-right:0cm;margin-bottom:19.5pt;margin-left: 0cm;text-indent:24.0pt;mso-char-indent-count:2.0;mso-pagination:widow-orphan"> <span style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">此外，新興競(jìng)爭(zhēng)對(duì)手的威脅也不可小覷，甚至大型連鎖超市和電信公司都有可能顛覆保險(xiǎn)行業(yè)的價(jià)值鏈。這些企業(yè)不但擁有價(jià)值連城的消費(fèi)者數(shù)據(jù)，而且擁有與客戶之間的“最后一公里”連接。在新的運(yùn)營(yíng)模式下，傳統(tǒng)保險(xiǎn)企業(yè)難以掌控整條價(jià)值鏈，且容易成為新型商業(yè)模式的顛覆目標(biāo)，例如一些網(wǎng)絡(luò)聚合搜索產(chǎn)品能夠?yàn)橄M(fèi)者提供價(jià)格透明的產(chǎn)品對(duì)比。<span lang="EN-US"><o:p></o:p></span></span></p> <p style="margin-top:19.5pt;margin-right:0cm;margin-bottom:19.5pt;margin-left: 0cm;text-indent:24.0pt;mso-char-indent-count:2.0;mso-pagination:widow-orphan"> <span style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">資金充裕的大型保險(xiǎn)公司可以利用投資抵御創(chuàng)新帶來的威脅，而那些只聚焦于內(nèi)部運(yùn)營(yíng)，對(duì)外部變化視而不見的中型企業(yè)將面臨更激烈的競(jìng)爭(zhēng)。對(duì)于保險(xiǎn)公司來說，了解消費(fèi)者的行為和需求是至關(guān)重要的能力，然而建設(shè)必需的大數(shù)據(jù)技術(shù)、文化和團(tuán)隊(duì)帶來的成本巨大，讓規(guī)模較小的保險(xiǎn)公司難以承受。對(duì)于保險(xiǎn)企業(yè)來說，有機(jī)成長(zhǎng)的機(jī)會(huì)非常有限。成熟市場(chǎng)已經(jīng)進(jìn)入到整合周期內(nèi)，盡管新興市場(chǎng)存在著發(fā)展機(jī)遇，但市場(chǎng)環(huán)境非常復(fù)雜。要在新市場(chǎng)形成規(guī)模效應(yīng)，并購顯然仍是各大保險(xiǎn)企業(yè)的明智之選。<span lang="EN-US"><o:p></o:p></span></span></p> <p align="center" style="margin-top:19.5pt;margin-right:0cm;margin-bottom:19.5pt; margin-left:0cm;text-align:center;mso-pagination:widow-orphan"> <span style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">世界排名前十保險(xiǎn)經(jīng)紀(jì)公司國(guó)際業(yè)務(wù)占比<span lang="EN-US"><o:p></o:p></span></span></p> <p align="center" style="margin-top:19.5pt;margin-right:0cm;margin-bottom:19.5pt; margin-left:0cm;text-align:center;mso-pagination:widow-orphan"> <img alt="" src="/baoxian/userfiles/1/images/back/news/2018/01/12.png" style="width: 554px; height: 289px;" /></p> <p style="margin-top:19.5pt;margin-right:0cm;margin-bottom:19.5pt;margin-left: 0cm;text-indent:24.1pt;mso-char-indent-count:2.0;mso-pagination:widow-orphan"> <b><span lang="EN-US" style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">4.</span></b><b><span style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">國(guó)際保險(xiǎn)經(jīng)紀(jì)行業(yè)利潤(rùn)水平<span lang="EN-US"><o:p></o:p></span></span></b></p> <p style="margin-top:19.5pt;margin-right:0cm;margin-bottom:19.5pt;margin-left: 0cm;text-indent:24.0pt;mso-char-indent-count:2.0;mso-pagination:widow-orphan"> <span style="font-family:宋體;mso-bidi-font-family:宋體;color:#252525">目前，<span lang="EN-US">2015</span>年全球保險(xiǎn)經(jīng)紀(jì)行業(yè)收入達(dá)<span lang="EN-US">581.3</span>億美元，國(guó)際保險(xiǎn)經(jīng)紀(jì)行業(yè)利潤(rùn)水平維持在<span lang="EN-US">10~25%</span>之間。<span lang="EN-US"><o:p></o:p></span></span></p>';
description = description.replace(/(\n)/g, ""); 
description = description.replace(/(\t)/g, ""); 
description = description.replace(/(\r)/g, ""); 
description = description.replace(/<\/?[^>]*>/g, ""); 
description = description.replace(/\s*/g, "");
console.log(description) 
</script>

4、jQuery JavaScript正則表達(dá)式與\n代替<BR>

Lee TaylorTeneff給出了該問題的處理方式：

var str = document.getElementById('mydiv').innerHTML;
document.getElementById('mytextarea').innerHTML = str.replace(/<br\s*[\/]?>/gi, "\n");

or using jQuery:

var str = $("#mydiv").html();
var regex = /<br\s*[\/]?>/gi;
$("#mydiv").html(str.replace(regex, "\n"));

5、要去除html標(biāo)簽，圖片，換行，回車等

description = description.replace(/(\n)/g, "");
description = description.replace(/(\t)/g, "");
description = description.replace(/(\r)/g, "");
description = description.replace(/<\/?[^>]*>/g, "");
description = description.replace(/\s*/g, "");

6、腳本之家小編寫的一個(gè)替換fackeditor中的多余br與空行的

//加強(qiáng)替換主要是考慮多個(gè)br的問題
function doRepAdvance(s){
var str=s.replace(/<p><br type="_moz"><\/p>/ig,"");
str=str.replace(/<br type="_moz">\n&nbsp;<\/p>/ig, "</p>");
str=str.replace(/<br type="_moz">\n<\/p>/ig, "</p>");
str=str.replace(/<br type="_moz">\n\r<\/p>/ig, "</p>");
str=str.replace(/<br type="_moz"><\/p>/ig,"</p>");
str=str.replace(/<br \/>\n&nbsp;<\/p>/ig, "</p>");
str=str.replace(/<br>\n&nbsp;<\/p>/ig, "</p>");
str=str.replace(/<br \/>\n<\/p>/ig, "</p>");
str=str.replace(/<br \/>\n\r<\/p>/ig, "</p>");
str=str.replace(/(<br>\n){1,}<\/p>/ig,"</p>");
str=str.replace(/(<br>){1,}<\/p>/ig,"</p>");
str=str.replace(/<br>\n<\/p>/ig, "</p>");
str=str.replace(/<br><\/p>/ig,"</p>");
str=str.replace(/<p> <\/p>/ig,"");
str=str.replace(/<p>&nbsp;<\/p>/ig,"");
str=str.replace(/<p> <\/p>/ig,"");
str=str.replace(/<p><\/p>/ig,"");
return str;
}

到此這篇關(guān)于js處理富文本編輯器轉(zhuǎn)義、去除轉(zhuǎn)義、去除HTML標(biāo)簽的正則的文章就介紹到這了,更多相關(guān)編輯器轉(zhuǎn)義、去除轉(zhuǎn)義、去除HTML標(biāo)簽內(nèi)容請(qǐng)搜素腳本之家以前的文章或下面相關(guān)文章，希望大家以后多多支持腳本之家！

您可能感興趣的文章: