js上的小正則表達式

Question

我是新來的正則表達式。 我有包含的變量：

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

變量中的字符串隨着My string和My value （隨機值）的更改而重復多次。 我需要找到具體的My value My string並將其（值）存儲在新變量中。 有時該字符串有空格，有時沒有空格。

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，則換行符除外。
+匹配1個或多個前面的令牌。
\\n換行符。
\\r回車符。
[\\r\\n]匹配集合中的任何單個字符。
{0,2}匹配前面的令牌的0到2。

現在，只需將其應用到您的代碼中即可。 您可以在http://gskinner.com/RegExr/上對其進行測試。

Answer 2

您實際上應該避免使用正則表達式來解析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; 

小提琴

注意， <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