I am trying to find substring from an HTML string by ignoring the commented code. I have tried something like below but it is nor giving me expected result , Any pointer will be really appreciated.
let a = `<div data-bind="attr: {id: componentId + 'MasterDetailContainer'}"
style="height: 100%; width: 100%">
<!-- master --> <!-- Bug 31793483 adding aria label -->
<div role="navigation" data-bind="attr: {id: componentId + 'MasterDetailStartDrawer'}">`;
let databindIndex =a.indexOf('data-bind');
//Get all the data till next valid starting tag ignoring commented code
let data =a.indexOf(/<\w\s/g,databindIndex);
console.log(data);
Expected output
`data-bind="attr: {id: componentId + 'MasterDetailContainer'}"
style="height: 100%; width: 100%">
<!-- master --> <!-- Bug 31793483 adding aria label -->`
You can use something like this:
const text = `<div data-bind="attr: {id: componentId + 'MasterDetailContainer'}"
style="height: 100%; width: 100%">
<!-- master --> <!-- Bug 31793483 adding aria label -->
<div role="navigation" data-bind="attr: {id: componentId + 'MasterDetailStartDrawer'}">`
const pattern = /data-bind[^\>]*>[\s\S]*<!--[\s\S]*?-->/
const result = text.match(pattern)
console.log({result})