Extract content inside a body tag as json using javascript HTML DOM in Flutter

Question

i am trying to figure out how to extract the json data from the following:

HTML RESPONSE

<html><body>
<pre style="word-wrap: break-word; white-space: pre-wrap;">
{'name':'john doe'}
</body></html>

I have Tried

document.body.innerHTML which returns null

and

document.body.outerHTML which returns

<body><pre style="word-wrap: break-word; white-space: pre-wrap;">{'name:'john doe'}</body>

What i want as a string

{'name':'john doe'}

Any help will be highly appreciated.

its just an example the full document does have closing tags — austin
– austin, Commented Aug 25, 2022 at 4:53

Vinod Liyanage · Accepted Answer · 2022-08-25 05:30:11Z

2

try this,

in your html

<html><body>
<pre style="word-wrap: break-word; white-space: pre-wrap;">
{"name":"john doe"} </pre>
</body></html>

in your js

const pre = document.querySelector('pre')
console.log(pre.innerText) // you can also use pre.textContent

checkout Difference between textContent vs innerText: Difference between textContent vs innerText

answered Aug 25, 2022 at 4:58

Vinod Liyanage

1,2006 silver badges15 bronze badges

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

5 Comments

Hey , so im using flutter framework and jsonDecode(pre.innerTEXT) is not returning a map .

did you mean pre.innerText? Your json data must have double quotes. {"name":"john doe"}

yeah pre.innerText but when i print it it gives "{"\name":"\John Does"}"

if i use jsonDecode("{"\name":"\John Does"}"), i get a string in response and not a MAP

since it's an issue of inter programming i tried jsonDecode("{jsonDecode(pre.innerText)}") . it's working now