一区二区三区在线-一区二区三区亚洲视频-一区二区三区亚洲-一区二区三区午夜-一区二区三区四区在线视频-一区二区三区四区在线免费观看

服務(wù)器之家：專注于服務(wù)器技術(shù)及軟件下載分享
分類導(dǎo)航

PHP教程|ASP.NET教程|Java教程|ASP教程|編程技術(shù)|正則表達(dá)式|C/C++|IOS|C#|Swift|Android|VB|R語言|JavaScript|易語言|vb.net|

服務(wù)器之家 - 編程語言 - 正則表達(dá)式 - Java/Js下使用正則表達(dá)式匹配嵌套Html標(biāo)簽

Java/Js下使用正則表達(dá)式匹配嵌套Html標(biāo)簽

2020-07-31 17:32正則之家 正則表達(dá)式

以前寫過一篇文章講解如何使用正則表達(dá)式完美解決Html嵌套標(biāo)簽的匹配問題（使用正則表達(dá)式匹配嵌套Html標(biāo)簽），但是里頭用到了平衡組這樣的高級特性，貌似只有DotNet還有Perl正則引擎支持，因此通用性不高。

js正則表達(dá)式替換HTML標(biāo)簽以及空格( )

js代碼：

  1. function filter(text) { 
  2.   var reg = /<[^<>]+>/g;//1、全局匹配g肯定忘記寫,2、<>標(biāo)簽中不能包含標(biāo)簽實現(xiàn)過濾HTML標(biāo)簽 
  3.   text = text.replace(reg, '');//替換HTML標(biāo)簽 
  4.   text = text.replace(/&nbsp;/ig, '');//替換HTML空格 
  5.   return text; 
  6.   }; 
 

在angularJS中使用過濾器過濾富文本數(shù)據(jù)

  1. app.filter('qxhtml', function () { 
  2.   return function (text) { 
  3.    var reg = /<[^<>]+>/g; 
  4.    text = text.replace(reg, ''); 
  5.    text = text.replace(/&nbsp;/ig, ''); 
  6.    if (text.length > 50) { 
  7.     text = text.substring(0, 50) + "..."; 
  8.    } 
  9.    return text; 
  10.   }; 
  11.  }); 
 

使用過濾器

<div class="desc">
{{y.Description| qxhtml}}
</div>

下面是其他網(wǎng)友的補充

js如何使用正則表達(dá)式實現(xiàn)過濾HTML標(biāo)簽？（/<[^<>]+>/g）

一、總結(jié)（點擊顯示或隱藏總結(jié)內(nèi)容）

js進(jìn)階正則表達(dá)式實現(xiàn)過濾HTML標(biāo)簽（<>標(biāo)簽中不能包含標(biāo)簽實現(xiàn)過濾HTML標(biāo)簽：/<[^<>]+>/g）

var reg=/<[^<>]+>/g

1、全局匹配g肯定不能忘記寫
2、<>標(biāo)簽中不能包含標(biāo)簽實現(xiàn)過濾HTML標(biāo)簽

二、js進(jìn)階正則表達(dá)式實現(xiàn)過濾HTML標(biāo)簽

實例描述：將一段帶有HTML標(biāo)簽的文本的HTML標(biāo)簽過濾掉，轉(zhuǎn)化為純文本輸出

三、代碼

  1. <!DOCTYPE html> 
  2. <html lang="en"> 
  3. <head> 
  4.  <meta charset="UTF-8"> 
  5.  <title>過濾HTML標(biāo)簽</title> 
  6.  <style type="text/css"> 
  7.   textarea{ 
  8.    width: 60%; 
  9.    font-size: 18px; 
  10.    background: rgba(100,200,50,0.3); 
  11.   } 
  12.   #text2{ 
  13.    background:rgba(200,100,50,0.3); 
  14.   } 
  15.  </style> 
  16. </head> 
  17. <body> 
  18.  <textarea id="text1" rows="10" cols="50"></textarea><br><br> 
  19.  <input type="button" id="btn1" value="過濾HTML標(biāo)簽"><br><br> 
  20.  <textarea id="text2" rows="10" cols="50"></textarea> 
  21.  <script type="text/javascript"> 
  22.   var btn1=document.getElementById('btn1') 
  23.   var text1=document.getElementById('text1') 
  24.   var text2=document.getElementById('text2') 
  25.   btn1.onclick=function (){ 
  26.    //var reg=/<.+>/g 
  27.    var reg=/<[^<>]+>/g //1、全局匹配g肯定忘記寫 2、<>標(biāo)簽中不能包含標(biāo)簽實現(xiàn)過濾HTML標(biāo)簽 
  28.    text2.value=text1.value.replace(reg,'') 
  29.   } 
  30.  </script> 
  31. </body> 
  32. </html> 
js 正則表達(dá)式去除html字符中所有的標(biāo)簽（img標(biāo)簽除外）

廢話不多說，直接上代碼：

description.replace(/<(?!img).*?>/g, "");

如果保留img,p標(biāo)簽，則為：

description.replace(/<(?!img|p|/p).*?>/g, "");

在js中/需要用轉(zhuǎn)義字符。

通用 HTML 標(biāo)簽區(qū)配正則

最近看網(wǎng)站日志，發(fā)現(xiàn)有人在博客上轉(zhuǎn)了我不知道幾年前寫的一個匹配 HTML 標(biāo)簽的正則，剛好最近也在做一些相關(guān)的事情，頓時來了興趣。就拿回來改改，成了下面這樣，可能會有一些 case 遺漏，歡迎修改，已知在內(nèi)嵌 <script> 復(fù)雜內(nèi)容的處理能力較弱，不過對純 HTML 來說已經(jīng)夠用，拿來做一些分析工具還是不錯滴。

  1. <script type="text/javascript">  
  2. var str = "<br /><br/><br><br ><中文><div><div id=a>無憂腳本<img src="http://bbs.51js.com/images/default/logo.gif" width="191" height='75' border=0 onload="if(testver>0 && testver<500)alert('test');" onerror='alert("test")' /><img src=xxx alt="hello just a test!"></div><hr ><script type="test/javascript" defer>alert("just a test!");</script>Hello.<input type=text value="無憂腳本"><br / ><img "" ></ ><!-- 注釋 -->< ucren><!-- 再<注>釋 --><img alt=' title='"' /><b>123</b>1<2<3,3<4>1&lt;b&gt;<img src="http://bbs.51js.com/images/old51js/logo.gif" /><!-- 三注釋>>> -->";  
  3. var reg = /<(?:(?:/?[A-Za-z]w*(?:[=s](['"]?)[sS]*?)*)|(?:!--[sS]*?--))/?>/g;  
  4. alert(str.match(reg).join(" ---------------------------------------------------- "));  
  5. </script>  

在線測試

  1.   
  2. <script type="text/javascript">  
  3. var str = "<br>[br/]<br><中文><div><div id=a>無憂腳本<img src="http://bbs.51js.com/images/default/logo.gif" width="191" height='75' border=0 onload="if(testver>0 && testver<500)alert('test');"  
  4.  onerror='alert("test")' /><img src=xxx alt="hello 
  5. just a test!"></div><hr ><script type="test/javascript" defer>alert("just a test!");</script>Hello.<input type=text value="無憂腳本"><br / ><img "" ></ ><!-- 注釋 -->< ucren><!-- 再<注>釋 --><img alt=' title='"' /><b>123</b>1<2<3,3<4>1&lt;b&gt;<img src="http://bbs.51js.com/images/old51js/logo.gif" /><!-- 三注釋>>> -->";  
  6. var reg = /<(?:(?:/?[A-Za-z]w*(?:[=s](['"]?)[sS]*?)*)|(?:!--[sS]*?--))/?>/g;  
  7. alert(str.match(reg).join(" 
  8. ---------------------------------------------------- 
  9. "));  
  10. </script>  

有朋友留言說Java直接使用的話會報錯。我后來查了一下，發(fā)現(xiàn)Java正則引擎支持的特性相對比較少。在1.6版本中不能使用命名組（貌似1.7的時候開始支持了），否則會報以下錯誤，更別說平衡組了。因此感覺要實現(xiàn)無限級的嵌套匹配不大現(xiàn)實。

java.util.regex.PatternSyntaxException: Look-behind group does not have an obvious maximum length near index XX

在網(wǎng)上搜了好久也沒找到完美的解決方案。不過，我們可以實現(xiàn)有限級Html嵌套標(biāo)簽匹配。思路相對于無限級來說就簡單了好多，不需要那么多高級的特性。
示例：

<div id='container'><BR> <div style='background-color:gray;' id='footer'><BR> <a id='gotop' href='#' onclick='MGJS.goTop();return false;'>Top</a><BR> <a id='powered' href='http://wordpress.org/'>WordPress</a><BR> <div id='copyright'><BR> Copyright &copy; 2009 簡單生活 —— Kevin Yang的博客<BR> </div><BR> <div id='themeinfo'><BR> Theme by <a href='http://www.neoease.com/'>mg12</a>. Valid <a href='http://validator.w3.org/check?uri=referer'>XHTML 1.1</a><BR> and <a href='http://jigsaw.w3.org/css-validator/'>CSS 3</a>.<BR> </div><BR> </div><BR></div>

在上面這個示例中，我們打算匹配id為footer的這個嵌套div，而且假設(shè)我們預(yù)先知道footer這個div里面最多只會嵌套一級div。更多級的情況我們一會兒再講。
footer的開始和結(jié)束標(biāo)簽匹配很簡單：

<div [^>]*id='footer'[^>]*>......(這里的省略號是一會要填寫的)</div>

夾在開始和結(jié)束標(biāo)簽之間的內(nèi)容無非有兩種情況：
內(nèi)容A: div標(biāo)簽，并且此div內(nèi)無嵌套div
內(nèi)容B: 任意其他內(nèi)容
然后就是這兩種內(nèi)容的不斷重復(fù)而已。正則表示如下：

(<div[^>]*>.*?</div>|.)*?

注意最后面的問號必須要加上，否則由于正則的貪婪匹配特性，footer的閉合標(biāo)簽會匹配失誤。
OK了，匹配最多嵌套一級div的正則表達(dá)式如下：

<div [^>]*id='footer'[^>]*>(<div[^>]*>.*?</div>|.)*?</div>

那么如果footer標(biāo)簽里頭最多會嵌套兩級div的話怎么辦呢？
其實也不難，我們只需要把上面的“內(nèi)容A”部分中的點號稍作替換即可。修改如下：

<div [^>]*id='footer'[^>]*>(<div[^>]*>(<div[^>]*>.*?</div>|.)*?</div>|.)*?</div>

到這里你可能就知道，如果要匹配最多嵌套三級div的話，正則應(yīng)該怎么寫了：

<div [^>]*id='footer'[^>]*>(<div[^>]*>(<div[^>]*>(<div[^>]*>.*?</div>|.)*?</div>|.)*?</div>|.)*?</div>

所以實際上，只要你的html結(jié)構(gòu)不是特別復(fù)雜的話，也就是說嵌套不會很深的話，那么你完全可以使用這種方式來匹配嵌套html標(biāo)簽。

這個正則在Java和Javascript中都可以使用，因為它沒有用到任何高級特性。

接著補充

查找所有的TD區(qū)域(最短):

<tds*.*>s*.*</td>

查找所有的TR:

<tr.*(?=>)(.| )*?</tr>

查找所有的TD:

<td.*(?=>)(.| )*?</td>

正則表達(dá)式匹配Html標(biāo)簽

例1.
以下是一段Html代碼

  1. <table boder="0" width="11%" class="somestory"> 
  2. <tr> 
  3. <td width="100%"> 
  4. <p align="center">其它內(nèi)容...</p> 
  5. </td> 
  6. </tr> 
  7. </table> 
  8. <table border="0" width="11%" class="headline"> 
  9. <tr> 
  10. <td width="100%"> 
  11. <p align="center">典經(jīng)HTML正則表達(dá)式！</p> 
  12. </td> 
  13. </tr> 
  14. </table> 
  15. <table boder="0" width="11%" class="someotherstory"> 
  16. <tr> 
  17. <td width="100%"> 
  18. <p align="center">其它內(nèi)容...</p> 
  19. </td> 
  20. </tr> 
  21. </table> 

正則表過式：<table.*(?=headline)
說明：正則表達(dá)式匹配表格開始標(biāo)記，能夠返回開始標(biāo)記直至 “headline”之間的所有內(nèi)容（換行除外）；
就是以上紅色標(biāo)示出來的部分。
原理：
<table                           //匹配的開始部分
.*                                   //除換行外的所有字符
(?=headline)               //零寬度正預(yù)測先行斷言，匹配以 headline 結(jié)尾的單詞的前面部分(除了 headline 以外的部分)

例2.

  1. <table boder="0" width="11%" class="somestory"> 
  2. <tr> 
  3. <td width="100%"> 
  4. <p align="center">其它內(nèi)容...</p> 
  5. </td> 
  6. </tr> 
  7. </table> 
  8. <table border="0" width="11%" class="headline"> 
  9. <tr> 
  10. <td width="100%"> 
  11. <p align="center">典經(jīng)HTML正則表達(dá)式！</p> 
  12. </td> 
  13. </tr> 
  14. </table> 
  15. <table boder="0" width="11%" class="someotherstory"> 
  16. <tr> 
  17. <td width="100%"> 
  18. <p align="center">其它內(nèi)容...</p> 
  19. </td> 
  20. </tr> 
  21. </table> 
 

正則表達(dá)式：<table.*(?=headline)(.| )*?</table>
說明：匹配最長的以 <table border="0" width="11%" class=" 開始， 以</table>結(jié)束的字符串，就是以上以紅色標(biāo)示出來的部分。

原理：

<table.*(?=headline)                  //參見記錄1的說明
(.| )                                             //指示在兩個或多個項之間進(jìn)行選擇，(zlf)ood 與 "zood" 或 "food" 匹配
*?                                                //應(yīng)與上一個 (.| ) 聯(lián)合起來看,  .*？ 就意味著匹配任意數(shù)量的重復(fù)，但是在能使整個匹配成功的前提下使用最少的重復(fù)，懶惰模式。
</table>                                     //匹配的結(jié)束標(biāo)記

注意：“(.| )”后面的 "*" 匹配 0 個到多個任意字符，而“？”使得“*”匹配范圍最小化，即在找到表達(dá)式的下一部分之前匹配盡可能少的字符。</table> 是表格的結(jié)束標(biāo)記.

 例3.

  1. <tableboder="0" width="11%" class="somestory"> 
  2. <tr> 
  3. <td width="100%"> 
  4. <p align="center">其它內(nèi)容...</p> 
  5. </td> 
  6. </tr> 
  7. </table> 
  8. <tableborder="0" width="11%" class="headline"> 
  9. <tr> 
  10. <td width="100%"> 
  11. <p align="center">典經(jīng)HTML正則表達(dá)式！</p> 
  12. </td> 
  13. </tr> 
  14. </table> 
  15. <tableboder="0" width="11%" class="someotherstory"> 
  16. <tr> 
  17. <td width="100%"> 
  18. <p align="center">其它內(nèi)容...</p> 
  19. </td> 
  20. </tr> 
  21. </table> 
 

正則表達(dá)式：<(?<tag>[^s>]+)[^>]*>(.| )*?</k<tag>>
說明：匹配成對的HTML標(biāo)簽，它將會匹配Html標(biāo)簽及標(biāo)簽中的內(nèi)容，本例分三段匹配三個<table>標(biāo)簽及</table>中的內(nèi)容。
原理：
<                                    //html標(biāo)簽中的 <
(?<tag>[^s>]+)            // (?<name>), 分組命名的方式，[^s>]：非任何空白字符及“>”至少匹配一次
[^>]*>                            //非“>”匹配 0 到 n 次，及html的標(biāo)簽“>”.
(.| )                              //在兩個或多個項之間時行選擇，(zlf)ood 與 "zood" 或 "food" 匹配.
*?                                  // 應(yīng)與上一個(.| )聯(lián)合起來看， .*？ 就意味著匹配任意數(shù)量的重復(fù)，但是在能使整個匹配成功的前提下使用最少的重復(fù)，懶惰模式。
</k<tag>>                    //反向引用命名的組，語法為 k<name>， 及html 標(biāo)簽“>”

注意：“(.| )”后面的 "*" 匹配 0 個到多個任意字符，而“？”使得“*”匹配范圍最小化，即在找到表達(dá)式的下一部分之前匹配盡可能少的字符。

本例使用了分組命名及反向引用命名組的概念。

正則表達(dá)匹配中文

匹配中文字符的正則表達(dá)式：   [u4e00-u9fa5]
1、先用js把中文轉(zhuǎn)換16進(jìn)制碼：d.innerHTML = escape("你們"); 得到 %u4F60%u4EEC， 即 u4F60u4EEC
2、var arr = str.match(/u4F60u4EEC/g);
3、u4F60為單個漢字“你”.
4、以上測試程序為javascript

到此這篇關(guān)于Java/Js下使用正則表達(dá)式匹配嵌套Html標(biāo)簽的文章就介紹到這了,更多相關(guān)正則表達(dá)式匹配嵌套Html標(biāo)簽 內(nèi)容請搜索服務(wù)器之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持服務(wù)器之家！

延伸 · 閱讀

精彩推薦
主站蜘蛛池模板： 亚洲精品午夜视频 | 性柔术18性13处交 | 天天澡夜夜澡狠狠澡 | 日本高清不卡一区久久精品 | 欧美特一级 | 大乳奶水bbw | 九色PORNY真实丨国产大胸 | 秘书小说 | 欧美高清3dfreexxxx性 | aⅴ视频在线免播放观看 | videos变态极端 | 99热久久这里只精品国产www | 俄罗斯三级完整版在线观看 | 日韩手机在线观看 | 国产久热精品 | 欧美高清无砖专区欧美精品 | 亚洲男人的天堂网站 | 男人好大好硬好爽免费视频 | 国产福利一区二区三区 | 青青青在线视频播放 | 国产拍拍视频一二三四区 | 成人黄色免费网站 | 护士xxxx | 无限韩国视频免费播放 | 秋葵丝瓜茄子草莓榴莲樱桃 | avove本人照片 | 男人天堂中文字幕 | www.男人的天堂.com | 国产麻豆视频 | 五月天婷婷亚洲 | 欧美18-19 | 精品久久久久久亚洲 | 午夜a一级毛片 | 婷婷色天使在线视频观看 | 国产福利视频一区二区微拍 | 爱豆传媒最新视频国产 | 国产欧美一区二区三区精品 | 国产精品欧美亚洲韩国日本99 | 精品久久久久免费极品大片 | 欧美美女被爆操 | 日韩亚洲人成网站在线播放 |