Javascript正则表达式-从字符串html获取div ID

Question

Consider the following code:

const content = "<div id='x'><h2>Lorem Ipsum</h2> <p>is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p></div>"

let ids = content.match(/id='(.*?)'/g).map((val) => {
    return val.replace(/id='/g,'');
})

And when I do console.log(ids) - I get the output like this 'x\\'' but I need only 'x' . I'm wondering how to achive that result, I've tried by randomly changing regex symbols, because I don't know regex at all - and nothing seems to be working.

No jquery please. Thank you in advance

Answer 1

 const content = "<div id='x'><h2>Lorem Ipsum</h2> <p>is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p></div>" let ids = content.match(/id='(.*?)'/g).map((val) => { return val.replace(/id='/g,'').replace("'",''); }) console.log(ids) 

Answer 2

when you use dot "." it means everything but you are searching everithing but ' character

const content = "<div id='x'><h2>Lorem Ipsum</h2> <p>is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p></div>"

let ids = content.match(/id='([^' .*?])'/g).map((val) => {
    return val.replace(/id='([^' .*?])'/g,'$1');
})

console.log(ids)

Answer 3

This answer explains an approach to getting DOM information from a string of HTML without the need for Regular Expressions (prone to bugs and errors when parsing DOM).

I am using a simple library (html-fragment) to create a DocumentFragment from the string of HTML. Since that string becomes a simple DOM tree in memory, you can querySelectorAll elements with the id attribute. You can then map the elements to get the array of ids.

 const content = "<div id='x'><h2>Lorem Ipsum</h2> <p>is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p></div>"; const fragment = HtmlFragment(content); let ids = Array .from(fragment.querySelectorAll('[id]')) .map(el => el.id); console.log(ids); 

 <script src="https://unpkg.com/html-fragment@1.1.0/lib/html-fragment.min.js"></script>