Question

我是正则表达式的新手。我有一个包含的变量：

<b><font color="#32748">My string:</font></b>
<big>  My value </big>
<br>

其字符串变量多次重复，并更改My string和My value（随机值）。我需要找到具体My value的{{1}}并在新变量中存储（值）。有时该字符串有空格，有时没有空格。

Answer 1

var myRegEx = /<b><font color="#[0-9]{3,6}">(.+)<\/font><\/b>[\r\n]{0,2}<big>(.+)<\/big>[\r\n]{0,2}<br>/i;
var myString = '<b><font color="#32748">My string:</font></b>\n<big>  My value     </big>\n<br>';
var myResult = myString.match(myRegEx);
console.log(myResult[1] + " | " + myResult[2]);

正则表达式：
[0-9]匹配0-9范围内的任何单个字符 {3,6}匹配前面令牌的3到6个 (.+)捕获组。
.匹配任何字符，但如果dotall为false，则换行符除外 +匹配前面标记中的一个或多个。
\n换行符。
\r回车符。
[\r\n]匹配集合中的任何单个字符 {0,2}匹配前面标记的0到2。

现在只需将其应用于您的代码中即可。您可以在http://gskinner.com/RegExr/进行测试。

Answer 2

你应该try to avoid using regular expressions for parsing HTML。特别是使用非常强大的工具来构建每个浏览器。

这是一个没有正则表达式的解决方案，我觉得很简单。

以下是它的工作原理：

我们创建一个HTML元素
浏览器已经包含了一个非常好的HTML解析器:)它处理名称中的空格，转义实体和部分HTML等边缘情况，就像它对网页一样。我们将HTML转储到元素中。
我们可以使用querySelector语法查询元素，如果你是一个古老的家伙，我们可以更简单的getElementsByTagName。
我们使用textContent属性来获取文本。

实际代码：

var test = '<b><font color="#32748">My string:</font></b><big>  My value </big><br>';

// we create an empty element and put the html in it
var div = document.createElement("div");
div.innerHTML = test;

// get the text from the font tag, as you asked for.
var test = div.querySelector("font").textContent;

Fiddle

注意，<font>标记已弃用，不应在新代码中使用。我考虑查看当前的HTML5规范，并了解现代HTML中的工作原理。

注意2，在oldIE中，您无法使用textContent，因此您可以innerHTML或innerText。

Answer 3

使用jquery做这样的事情：

var t = '<b><font color="#32748">My string:</font></b><big>  My value </big><br><b><font color="#32748">My string1:</font></b><big>  My value1 </big><br>';

var data = $('big', $('<div/>').append(t)).map(function() {
  return $.trim($(this).text());
});

console.log(data[0]);  // My value 
console.log(data[1]);  // My value1

关于js的小正则表达式

3 个答案:

Fiddle