从 RSS 源 XML 中提取文本标签（使用 Javascript/React）

Question

I've just parsed an RSS Feed (Upwork's), and I have job item data points like title, link etc parsed out as data points (items.title, items.link), however a majority of the data I need to extract about the job (its category, skills etc) is dumped in the "content" data item as one giant block of text. Generally speaking, the title of the information I need is couched intags and the information itself is just a blob of text followed by a tag.

Here is an example from the XML (items.content):

We are looking for a developer with capabilities as a Wordpress Frontend/Backend Developer&nbsp;or&nbsp;Full Stack Wordpress Developer. <br /><br /> It is important for us to have experience with hosting, SSL, and&nbsp;Pagebuilders&nbsp;(Elementor/Visual Composer).<br /><br /><b>Hourly Range</b>: $20.00-$45.00 <br /><b>Posted On</b>: December 16, 2020 23:12 UTC<br /><b>Category</b>: Full Stack Development<br /><b>Skills</b>:Website Development, API, Website Redesign, WordPress Plugin, Website Optimization, Google Analytics, Java, JavaScript, PHP, Ruby, Scala, Kotlin, Python, SQL, Very Small (1-9 employees), CSS, Website Security, HTML, Graphic Design, Web Design, jQuery, Adobe Photoshop, Adobe Illustrator <br /><b>Location Requirement</b>: Only freelancers located in the United States may apply. <br /><b>Country</b>: United States <br /><a href="https://www.upwork.com/jobs/Ongoing-Website-development-specialist_%7E018e7e903a64f4e78e?source=rss">click to apply</a>

How do I pull out, for example, the label "Hourly Range" and then the data associated with it: ($20.00 - $45.00)? To add complexity to this, I would ideally need to be able to separate out each item listed (eg HTML, CSS) into separate date items of their own.

I'm at a loss on how to read this text & extract out the data I need in an organized way. Any help appreciated!

Answer 1

Anything in DOM is a node. The labels are the b element nodes. And their data the text node siblings.

 const snippet = (new DOMParser()).parseFromString(getHTML(), 'text/html'); const data = {}; for (const label of snippet.querySelectorAll('b')) { const name = normalizeSpace(label.textContent); let value = normalizeSpace( label.nextSibling.textContent.replace(/^:/, '') ); if (name === 'Skills') { value = value.split(/\s*,\s*/); } data[name] = value; } console.log(data); function normalizeSpace(value) { return value.replace(/\s{2,}/g, ' ').trim(); } function getHTML(){ return `We are looking for a developer with capabilities as a Wordpress Frontend/Backend Developer&nbsp;or&nbsp;Full Stack Wordpress Developer. <br /><br /> It is important for us to have experience with hosting, SSL, and&nbsp;Pagebuilders&nbsp;(Elementor/Visual Composer).<br /><br /><b>Hourly Range</b>: $20.00-$45.00 <br /><b>Posted On</b>: December 16, 2020 23:12 UTC <br /><b>Category</b>: Full Stack Development<br /><b>Skills</b>:Website Development, API, Website Redesign, WordPress Plugin, Website Optimization, Google Analytics, Java, JavaScript, PHP, Ruby, Scala, Kotlin, Python, SQL, Very Small (1-9 employees), CSS, Website Security, HTML, Graphic Design, Web Design, jQuery, Adobe Photoshop, Adobe Illustrator <br /><b>Location Requirement</b>: Only freelancers located in the United States may apply. <br /><b>Country</b>: United States <br /> <a href="https://www.upwork.com/jobs/Ongoing-Website-development-specialist_%7E018e7e903a64f4e78e?source=rss">click to apply</a>`; }