Parse HTML as a plain text via JavaScript

Question

I am making some ajax request that returns the whole HTML page as the response. I need to grab some data from that page, in particular, value of specific <input>.

What is the best way to do that?

My ideas:

Find where the <body> tag ends and </body> starts, grab all stuff inside to string, and put via innerHTML to some container.
Self-made parser: find the character position of the id I need, convert response string to an array, set position of reading equals position of id character, shift to where " character starts, read to buffer until new " come.

It would be perfect if there is a framework that uses classic DOM syntax to do that, like:

htmlString.getElementById("someid").value

"What is the best way..." ask for a (most likely) opinion-based answer which is off-topic for SO. "It would be perfect if there is a framework..." asks for an external resource which is also off-topic for SO. — Andreas
– Andreas, Commented Sep 13, 2020 at 10:13
@Andreas the best way (obviously) means the fastest, the easiest to use. It is not subjective, because we can count how many steps one should do, how much time it cost to run it. — Artur
– Artur, Commented Sep 13, 2020 at 10:46

Dipen Bhikadya · Accepted Answer · 2021-10-09 09:39:51Z

18

A pretty elegant solution is to use DOMParser.

const parser = new DOMParser()
const virtualDoc = parser.parseFromString(htmlString, 'text/html')

Then, treat virtualDoc like you'd treat any DOM-element,

virtualDoc.getElementById('someid').value

edited Oct 9, 2021 at 9:39

Dipen Bhikadya

3,3703 gold badges23 silver badges20 bronze badges

answered Sep 13, 2020 at 10:12

eds1999

1,0782 gold badges12 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

AbsoluteBeginner Over a year ago

There's a typo in your code: virtualDom should be virtualDoc.

Artur · Accepted Answer · 2020-09-13 10:08:26Z

-1

Don’t know how good is it, but just passing the whole response with <html> and others tags to some container works. Then, one needs just to call

document.getElementById("needid").value

answered Sep 13, 2020 at 10:08

Artur

3551 gold badge4 silver badges18 bronze badges

1 Comment

Andreas Over a year ago

Is this an answer? If so, then please make it a good answer

Collectives™ on Stack Overflow

Parse HTML as a plain text via JavaScript

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related