iT邦幫忙

0

JS的正規表示法問題

  • 分享至 

  • xImage

想問的是有關於match用法

範例1(這個我沒問題)

const input = "As I was going to Saint Ives";
const reg = /\w{3,}/ig;
input.match(reg);    //["was","going","Saint","Ives"]

範例2(這裡不大懂)

const html = `<a class="foo" href="/foo" id="foo">Foo</a>\n` +
            `<A href ='/foo' Class="foo">Foo</a>\n` +
            `<a href="/foo">Foo</a>\n` +
            `<a onclick="javascript:alert('foo!')" href="/foo">Foo</a>`;
function sanitizeATag(aTag){
    const parts = aTag.match(/<a\s+(.*?)>(.*?)<\/a>/i);
    console.log(parts);
}

sanitizeATag(html);
/*
結果:
[
  '<a class="foo" href="/foo" id="foo">Foo</a>',
  'class="foo" href="/foo" id="foo"',
  'Foo',
  index: 0,
  input: '<a class="foo" href="/foo" id="foo">Foo</a>\n' +
    `<A href ='/foo' Class="foo">Foo</a>\n` +
    '<a href="/foo">Foo</a>\n' +
    `<a onclick="javascript:alert('foo!')" href="/foo">Foo</a>`,
  groups: undefined
]
*/

不大懂為什麼範例2,JS怎麼去解讀它?
懇請各位先進不吝指教,我想過1天了,還是看不大懂..

淺水員 iT邦大師 6 級 ‧ 2021-08-25 21:29:36 檢舉
我想關鍵是「非貪心量化(Non-greedy quantifiers)」
可以參考一下這個
https://zh.wikipedia.org/wiki/%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F
O口O iT邦新手 4 級 ‧ 2021-08-26 10:29:41 檢舉
感謝你的參與
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 個回答

2
Todd
iT邦新手 1 級 ‧ 2021-08-26 00:39:11
最佳解答

/<a\s+(.*?)>(.*?)<\/a>/i
每個括號都是一個 capturing group
所以match回傳第一個是整個pattren match
然後是<a\s> 中間的(.*?)
最後就是 ><中間的(.*?)

O口O iT邦新手 4 級 ‧ 2021-08-26 10:26:22 檢舉

懂了,感謝您的幫忙~
補充一下,這個結果如果加上g的參數就不會有每個group的結果了

我要發表回答

立即登入回答