how can spilit img src form this js html variable ( this is rss that i call it )

Question

var a = '<p><img loading="lazy" class="size-full wp-image-6491 aligncenter" src="https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance.jpg" alt="" width="1200" height="676" srcset="https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance.jpg 1200w, https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance-300x169.jpg 300w, https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance-1024x577.jpg 1024w, https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance-768x433.jpg 768w, https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance-1000x563.jpg 1000w" sizes="(max-width: 1200px) 100vw, 1200px"></p>'

how can spilit img src form this js html variable ( this is rss that i call it )

Answer 1

Use RegExp::exec with g flag and a backward assertion to search inside srcset attribute:

var a = '<p><img loading="lazy" class="size-full wp-image-6491 aligncenter" src="https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance.jpg" alt="" width="1200" height="676" srcset="https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance.jpg 1200w, https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance-300x169.jpg 300w, https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance-1024x577.jpg 1024w, https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance-768x433.jpg 768w, https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance-1000x563.jpg 1000w" sizes="(max-width: 1200px) 100vw, 1200px"></p>'

const regex = /(?<=srcset=".*)([^\s]+) (\d+)w/g;

const images = [];
let m;
while(m = regex.exec(a)){
  const [, src, width] = m;
  images.push({src, width});
}

console.log(images);

Answer 2

var a = '<p><img loading="lazy" class="size-full wp-image-6491 aligncenter" src="https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance.jpg" alt="" width="1200" height="676" srcset="https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance.jpg 1200w, https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance-300x169.jpg 300w, https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance-1024x577.jpg 1024w, https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance-768x433.jpg 768w, https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance-1000x563.jpg 1000w" sizes="(max-width: 1200px) 100vw, 1200px"></p>';

var src = a.match(/src="(.*?)"/)[1];

console.log(src); // https://rahaimport.net/blog/wp-content/uploads/2022/10/Export-clearance-clearance.jpg

First, we use the match() method to find the src attribute in the HTML variable. The match() method returns an array of strings, where each string is a match for the specified regular expression. In this case, the regular expression matches the src attribute, and the first string in the array is the image URL.