\\ n vs / m在javascript正則表達式中

Question

我明白那個：

\\n代表換行符。

/m表示多行匹配。

我已經寫了一個小例子：

 $('button').click(function () { var reg = /(<span>)(\\n?)([\\[\\w\\s\\.\\]]+)(\\2)/g; var div = $('body > div'); div.html(div.html().replace(reg, '$1$2[edited...]$4')); $('body').append($('<p>').text(div.html())) }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div> [div text...] <div> [child div text...] </div> <span> [child span text 1...] </span> <br /> <span> [child span text 2...] </span> </div> <button>click me</button> 

它將進行一些更改：

1 /。 查找所有<span>標簽。

2 /。 將每個標簽的文本替換為[edited...] 。

3 /。 顯示父html以再次檢查。

工作正常。

這是我的問題：

var reg = /(<span>)(\n?)([\[\w\s\.\]]+)(\2)/g;

(<span>) ：起始范圍標記。

(\\n?) ：換行（如果需要）。

([\\[\\w\\s\\.\\]]+) ：代表[child span text 1/2...] 。

(\\2) ：換行（如果需要）。

1 /。 為什么沒有結束span標簽（ <\\/span> ）就可以工作？ 我的意思是：盡管我不需要，但它包含結束標記。

2 /。 在替換中： .replace(reg, '$1$2[edited...]$4') 。 我不需要添加</span>標記，它是自動的。 如果我有一個情況，可能是一個問題：

Hey regex, I don't require it. But why are you done it?

可能是：所有現代瀏覽器都很聰明，足以理解我需要結束標記（ </span> ）。 但是， 我正在使用正則表達式和字符串，而不是HTML。

那么，是否應該在將來進行編輯？

3 /。 如果我從正則表達式中刪除(\\n?)和(\\2) 。 它仍然有效：

 $('button').click(function () { var reg = /(<span>)([\\[\\w\\s\\.\\]]+)/g; var div = $('body > div'); div.html(div.html().replace(reg, '$1[edited...]')); $('body').append($('<p>').text(div.html())) }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div> [div text...] <div> [child div text...] </div> <span> [child span text 1...] </span> <br /> <span> [child span text 2...] </span> </div> <button>click me</button> 

在這種情況下，結果相同：

var reg = /(<span>)([\[\w\s\.\]]+)/gm;

顯然，不需要\\n和/m 。 無論是否添加，它都可以正常工作。

因此， \\n和/m類似於嗎？

Answer 1

1. 它不會影響</span>標記，但是由於它在源代碼中存在，因此它將在輸出中存在，並且保持不變。

2. 應該對其進行編輯，但這僅僅是因為您不應該使用正則表達式來解析HTML。

3. 您要匹配的事物列表是[\\[\\w\\s\\.\\]]+ ，並且\\s包含\\n因此如果您之前有(\\n?) ，它不會更改任何內容。

不要使用正則表達式。

$('button').click(function () {
  var div = $('body > div');
  div.find("span").text("[edited...]");
  $('body').append($('<p>').text(div.html()));
})

完成...