CODEWITHSUNDEEP
javascriptregex
tilly
tilly

Reputation: 2610

Regular expressions: grab part of string

So I got the following input inside my textarea element:

<quote>hey</quote>

what's up?

I want to separate the text between the <quote> and </quote> ( so the result would be 'hey' and nothing else in this case.

I tried with .replace and the following regular expression, but it did not achieve the right result and I can't see why:

quoteContent = value.replace(/<quote>|<\/quote>.*/gi, ''); (the result is 'hey what's up'it doesn't remove the last part, in this case 'what's up', it only removes the quote marks)

Does someone know how to solve this?

Upvotes: 0

Views: 128

Answers (4)

baao
baao

Reputation: 73241

Even if it's only a small html snippet, don't use regex to do any html parsing. Instead, take the value, use DOM methods and extract the text from an element. A bit more code, but the better and safer way to do that:

const el = document.getElementById('foo');
const tmp = document.createElement('template');
tmp.innerHTML = el.value;
console.log(tmp.content.querySelector('quote').innerText);
<textarea id="foo">
<quote>hey</quote>

what's up?
</textarea>

Upvotes: 3

Mike Samuel
Mike Samuel

Reputation: 120516

You should try to avoid parsing HTML using regular expressions.

<quote><!-- parsing HTML is hard when </quote> can appear in a comment -->hey</quote>

You can just use the DOM to do it for you.

// Parse your fragment
let doc = new DOMParser().parseFromString(
    '<quote>hey</quote>\nWhat\'s up?', 'text/html')
// Use DOM lookup to find a <quote> element and get its
// text content.
let { textContent } = doc.getElementsByTagName('quote')[0]
// We get plain text and don't need to worry about "&lt;"s
textContent === 'hey'

Upvotes: 1

clarmond
clarmond

Reputation: 358

You could also try using the match method:

quoteContent = value.match(/<quote>(.+)<\/quote>/)[1];

Upvotes: 1

scunliffe
scunliffe

Reputation: 63588

The dot . will not match new lines.

Try this:

//(.|\n)* will match anything OR a line break
quoteContent = value.replace(/<quote>|<\/quote>(.|\n)*/gi, '');

Upvotes: -1

Related Questions