How to get information in a nested div?

Question

This is my html:

    <div id="border1">parents nodes text
        <div id="border2">the target node
            <div id="border3">the main nodes child node</div>
        </div>
    </div>

I want to save first div output which is parents nodes text . when i use
let big = document.getElementById("border1").innerText

it will give me all texts in all of divs!

How can i solve this problem?

You are trying to get the first text node, does this answer your question? [How to get the text node of an element?](https://stackoverflow.com/questions/6520192/how-to-get-the-text-node-of-an-element) — Hamza Abdaoui, Dec 29 '20 at 14:29

MotemaddeN · Answer 1 · 2020-12-30T06:41:37.877

1

do this:

const mainElId = "border1";
const mainEl = document.getElementById(mainElId);
let data = {};
mainEl.querySelectorAll('*').forEach(n => {
  data[n.getAttribute('id')] = n.innerText;
  n.remove();
}
);
data[mainElId] = mainEl.innerText;
console.log(data);

<div id="border1">parents nodes text
        <div id="border2">the target node
            <div id="border3">the main nodes child node</div>
        </div>
    </div>

edited Dec 30 '20 at 06:41

answered Dec 29 '20 at 14:19

MotemaddeN

524
3
9

i want to save each div information at the same time, this will remove every div except the first one! – sep_The_new_elixiR Dec 29 '20 at 14:59

How to get information in a nested div?

1 Answers1