Java/Js下使用正則表達式匹配嵌套Html標(biāo)簽
js正則表達式替換HTML標(biāo)簽以及空格( )
js代碼：
function filter(text) {
var reg = /<[^<>]+>/g;//1、全局匹配g肯定忘記寫,2、<>標(biāo)簽中不能包含標(biāo)簽實現(xiàn)過濾HTML標(biāo)簽
text = text.replace(reg, '');//替換HTML標(biāo)簽
text = text.replace(/ /ig, '');//替換HTML空格
return text;
};
在angularJS中使用過濾器過濾富文本數(shù)據(jù)
app.filter('qxhtml', function () {
return function (text) {
var reg = /<[^<>]+>/g;
text = text.replace(reg, '');
text = text.replace(/ /ig, '');
if (text.length > 50) {
text = text.substring(0, 50) + "...";
}
return text;
};
});
使用過濾器
<div class="desc">
{{y.Description| qxhtml}}
</div>
下面是其他網(wǎng)友的補充
js如何使用正則表達式實現(xiàn)過濾HTML標(biāo)簽？（/<[^<>]+>/g）
一、總結(jié)（點擊顯示或隱藏總結(jié)內(nèi)容）
js進階正則表達式實現(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進階正則表達式實現(xiàn)過濾HTML標(biāo)簽
實例描述：將一段帶有HTML標(biāo)簽的文本的HTML標(biāo)簽過濾掉，轉(zhuǎn)化為純文本輸出
三、代碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>過濾HTML標(biāo)簽</title>
<style type="text/css">
textarea{
width: 60%;
font-size: 18px;
background: rgba(100,200,50,0.3);
}
#text2{
background:rgba(200,100,50,0.3);
}
</style>
</head>
<body>
<textarea id="text1" rows="10" cols="50"></textarea><br><br>
<input type="button" id="btn1" value="過濾HTML標(biāo)簽"><br><br>
<textarea id="text2" rows="10" cols="50"></textarea>
<script type="text/javascript">
var btn1=document.getElementById('btn1')
var text1=document.getElementById('text1')
var text2=document.getElementById('text2')
btn1.onclick=function (){
//var reg=/<.+>/g
var reg=/<[^<>]+>/g //1、全局匹配g肯定忘記寫 2、<>標(biāo)簽中不能包含標(biāo)簽實現(xiàn)過濾HTML標(biāo)簽
text2.value=text1.value.replace(reg,'')
}
</script>
</body>
</html>
js 正則表達式去除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)夠用，拿來做一些分析工具還是不錯滴。
<script type="text/javascript">
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');\" \n onerror='alert(\"test\")' /><img src=xxx alt=\"hello\njust 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<b><img src=\"http://bbs.51js.com/images/old51js/logo.gif\" /><!-- 三注釋>>> -->";
var reg = /<(?:(?:\/?[A-Za-z]\w*\b(?:[=\s](['"]?)[\s\S]*?\1)*)|(?:!--[\s\S]*?--))\/?>/g;
alert(str.match(reg).join("\n----------------------------------------------------\n"));
</script>
在線測試
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
有朋友留言說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' >WordPress</a><BR> <div id='copyright'><BR> Copyright © 2009 簡單生活 —— Kevin Yang的博客<BR> </div><BR> <div id='themeinfo'><BR> Theme by <a >mg12</a>. Valid <a >XHTML 1.1</a><BR> and <a >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的正則表達式如下：
<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ū)域(最短):
<td\s*.*>\s*.*<\/td>
查找所有的TR:
<tr.*(?=>)(.|\n)*?</tr>
查找所有的TD:
<td.*(?=>)(.|\n)*?</td>
正則表達式匹配Html標(biāo)簽
例1.
以下是一段Html代碼
<table boder="0" width="11%" class="somestory"> <tr> <td width="100%"> <p align="center">其它內(nèi)容...</p> </td> </tr> </table> <table border="0" width="11%" class="headline"> <tr> <td width="100%"> <p align="center">典經(jīng)HTML正則表達式！</p> </td> </tr> </table> <table boder="0" width="11%" class="someotherstory"> <tr> <td width="100%"> <p align="center">其它內(nèi)容...</p> </td> </tr> </table>
正則表過式：<table.*(?=headline)
說明：正則表達式匹配表格開始標(biāo)記，能夠返回開始標(biāo)記直至 “headline”之間的所有內(nèi)容（換行除外）；
就是以上紅色標(biāo)示出來的部分。
原理：
<table //匹配的開始部分
.* //除換行外的所有字符
(?=headline) //零寬度正預(yù)測先行斷言，匹配以 headline 結(jié)尾的單詞的前面部分(除了 headline 以外的部分)
例2.
<table boder="0" width="11%" class="somestory"> <tr> <td width="100%"> <p align="center">其它內(nèi)容...</p> </td> </tr> </table> <table border="0" width="11%" class="headline"> <tr> <td width="100%"> <p align="center">典經(jīng)HTML正則表達式！</p> </td> </tr> </table> <table boder="0" width="11%" class="someotherstory"> <tr> <td width="100%"> <p align="center">其它內(nèi)容...</p> </td> </tr> </table>
正則表達式：<table.*(?=headline)(.|\n)*?</table>
說明：匹配最長的以 <table border="0" width="11%" class=" 開始， 以</table>結(jié)束的字符串，就是以上以紅色標(biāo)示出來的部分。
原理：
<table.*(?=headline) //參見記錄1的說明
(.|\n) //指示在兩個或多個項之間進行選擇，(zlf)ood 與 "zood" 或 "food" 匹配
*? //應(yīng)與上一個 (.|\n) 聯(lián)合起來看, .*？ 就意味著匹配任意數(shù)量的重復(fù)，但是在能使整個匹配成功的前提下使用最少的重復(fù)，懶惰模式。
</table> //匹配的結(jié)束標(biāo)記
注意：“(.|\n)”后面的 "*" 匹配 0 個到多個任意字符，而“？”使得“*”匹配范圍最小化，即在找到表達式的下一部分之前匹配盡可能少的字符。</table> 是表格的結(jié)束標(biāo)記.
例3.
<tableboder="0" width="11%" class="somestory"> <tr> <td width="100%"> <p align="center">其它內(nèi)容...</p> </td> </tr> </table> <tableborder="0" width="11%" class="headline"> <tr> <td width="100%"> <p align="center">典經(jīng)HTML正則表達式！</p> </td> </tr> </table> <tableboder="0" width="11%" class="someotherstory"> <tr> <td width="100%"> <p align="center">其它內(nèi)容...</p> </td> </tr> </table>
正則表達式：<(?<tag>[^\s>]+)[^>]*>(.|\n)*?</\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)簽“>”.
(.|\n) //在兩個或多個項之間時行選擇，(zlf)ood 與 "zood" 或 "food" 匹配.
*? // 應(yīng)與上一個(.|\n)聯(lián)合起來看， .*？ 就意味著匹配任意數(shù)量的重復(fù)，但是在能使整個匹配成功的前提下使用最少的重復(fù)，懶惰模式。
</\k<tag>> //反向引用命名的組，語法為 \k<name>， 及html 標(biāo)簽“>”
注意：“(.|\n)”后面的 "*" 匹配 0 個到多個任意字符，而“？”使得“*”匹配范圍最小化，即在找到表達式的下一部分之前匹配盡可能少的字符。
本例使用了分組命名及反向引用命名組的概念。
正則表達匹配中文
匹配中文字符的正則表達式： [\u4e00-\u9fa5]
1、先用js把中文轉(zhuǎn)換16進制碼：d.innerHTML = escape("你們"); 得到 %u4F60%u4EEC， 即 \u4F60\u4EEC
2、var arr = str.match(/\u4F60\u4EEC/g);
3、\u4F60為單個漢字“你”.
4、以上測試程序為javascript
到此這篇關(guān)于Java/Js下使用正則表達式匹配嵌套Html標(biāo)簽的文章就介紹到這了,更多相關(guān)正則表達式匹配嵌套Html標(biāo)簽 內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
- java正則表達式四種常用的處理方式（匹配、分割、替代、獲取）
- JAVA中正則表達式匹配，替換，查找，切割的方法
- Java使用正則表達式(regex)匹配中文實例代碼
- Java基于正則表達式實現(xiàn)查找匹配的文本功能【經(jīng)典實例】
- Java基于正則表達式實現(xiàn)的替換匹配文本功能【經(jīng)典實例】
- Java正則表達式匹配電話格式
- java正則表達式匹配網(wǎng)頁所有網(wǎng)址和鏈接文字的示例
- Java正則表達式(匹配、切割、替換、獲取)等方法
- Java使用正則表達式匹配獲取鏈接地址的方法示例
- Java正則表達式如何匹配特定html標(biāo)簽內(nèi)的內(nèi)容
相關(guān)文章
這篇文章主要整理了ASP.NET的常用正則表達式，有需要的朋友可以收藏一下2015-09-09
[紅色]去html代碼的正則 推薦...2006-10-10
這篇文章主要介紹了JS正則表達式必須包含數(shù)字、字母、特殊字符的相關(guān)資料,文中還給大家提到了js 正則表達式 匹配除漢字，字母，數(shù)字，逗號，句號外的特殊字符（用來規(guī)范輸入內(nèi)容） 需要的朋友可以參考下2019-08-08
如何刪除文本框里的文字內(nèi)容中段落之間多余的分行...2006-10-10
昨天在CentOS 5.2 boost::regex庫上,測試的網(wǎng)上來的一段代碼時 (\\w*)死活不能匹配中文 參考了下邊連接里的內(nèi)容2009-08-08
這篇文章主要介紹了正則表達式驗證IPV4地址功能,結(jié)合實例形式分析了IPV4地址驗證的原理及具體實現(xiàn)技巧,需要的朋友可以參考下2017-01-01
本文給大家介紹js中的正則表達式的注意事項以及pattern的注意事項，需要的小伙伴可以參考下本篇文章2015-10-10
這篇文章主要介紹了Python正則表達式操作指南的相關(guān)資料,需要的朋友可以參考下2015-09-09
筆記三則，貼在這里。2010-07-07
通過本文帶領(lǐng)大家學(xué)習(xí)JavaScript中都有哪些操作正則的方法。本文給大家介紹的非常詳細，具有一定的參考借鑒價值，需要的朋友參考下吧2018-11-11