链接：http://www.renrousousuo.com/tools/regex_debug.html
截图：
第二版 添加Replace功能
第一版 基本Match功能
有一个专门调试正则工具叫：RegexBuddy，3.2版本大概有10M而且不是免费的
我经常使用的功能其实不多，就是把正则输入，看看能匹配多少
简写为html一个文件就搞定了，这里分享一下：
html小工具开源项目：http://code.google.com/p/htmltools
文件下载链接：http://htmltools.googlecode.com/files/regex_debug.html
源代码：
- HTML code
?<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Javascript正则表达式调试工具</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="javascript regex 正则表达式 调试 工具"/>
<meta name="author" content="王集鹄"/>
<style type="text/css">
table{width:100%;}
#text_regex{width:100%;}
#textarea_text{width:100%;height:300px;}
#span_info{color:Red;}
#div_grippie{background-color:#888;border-color:#444;border-style:solid;border-width:0 1px 1px;cursor:s-resize;height:9px;}
.zebra0{background-color:Red;color:Blue;}
.zebra1{background-color:yellow;color:Green;}
</style>
</head>
<body>
<table>
<!--tr><td>TODO : 放置选项</td></tr-->
<tr><td>正则表达式 <span id="span_info"></span></td></tr>
<tr><td>
<input type="text" id="text_regex"/>
</td></tr>
<tr><td>测试文本内容</td></tr>
<tr><td>
<textarea id="textarea_text" cols="*" rows="*"></textarea>
<div id="div_grippie"></div>
</td></tr>
<tr><td>搜索结果 (<span id="span_result">0</span>)</td></tr>
<tr><td>
<div id="div_result"></div>
</td></tr>
</table>
<script type="text/javascript">
/*--
标题：正则表达式调试工具
设计：王集鹄
博客：http://blog.csdn.net/zswang
日期：2010年4月23日
--*/
function text2Html(str) { // 过滤html字符串
return str.replace(/[&"<> \t\n]/g, function() {
return ({
"&": "&"
, "\"": """
, "<": "<"
, ">": ">"
, " ": " "
, "\n": "<br/>"
, "\t": new Array(5).join(" ")
})[arguments[0]];
});
}
function regexEncode(text) { // 构建正则表达式对象
if (!text) return;
var match = text.match(/^\/(([^\\\/\n\r]*(\\.)*)+)\/([img]{0,3})$/);
if (!match) return;
try {
return new RegExp(match[1], match[4]);
} catch(ex) {
}
}
(function() {
var text_regex = document.getElementById("text_regex");
var span_info = document.getElementById("span_info");
var textarea_text = document.getElementById("textarea_text");
var div_result = document.getElementById("div_result");
var span_result = document.getElementById("span_result");
var lastText, lastRegex;
var doChange = function() {
var error = "";
var regex = regexEncode(lastRegex);
if (!regex) error += " 无效的表达式";
if (!lastText) error += " 没有测试内容";
span_info.innerHTML = error;
if (error) {
div_result.innerHTML = "";
span_result.innerHTML = 0;
return;
}
var i = 0;
var count = 0; // 寻找到的个数
var html = [];
var match = regex.exec(lastText);
var old = -1; // 记录原始序号比较是否发生变化，避免死循环
while (match && match[0] && old != match.index) {
if (match.index > i)
html.push(text2Html(lastText.substring(i, match.index)));
html.push("<span class=\"zebra");
html.push(count++ % 2);
html.push("\">");
html.push(text2Html(match[0]));
html.push("</span>");
i = match.index + match[0].length;
old = match.index;
match = regex.exec(lastText);
}
if (i < lastText.length) html.push(text2Html(lastText.substr(i)));
div_result.innerHTML = html.join("");
span_result.innerHTML = count;
};
textarea_text.onpropertychange = text_regex.onpropertychange = function() {
if (lastText == textarea_text.value && lastRegex == text_regex.value) return; // 表达式和内容未发生变化
lastText = textarea_text.value;
lastRegex = text_regex.value;
doChange();
};
if (text_regex.addEventListener) {
text_regex.addEventListener("keypress", text_regex.onpropertychange, false);
text_regex.addEventListener("keyup", text_regex.onpropertychange, false);
text_regex.addEventListener("input", text_regex.onpropertychange, false);
}
if (textarea_text.addEventListener) {
textarea_text.addEventListener("keypress", textarea_text.onpropertychange, false);
textarea_text.addEventListener("keyup", textarea_text.onpropertychange, false);
textarea_text.addEventListener("input", textarea_text.onpropertychange, false);
}
text_regex.onpropertychange();
})();
</script>
</body>
</html>