How to get text from an element with space in javascript

Question

The HTML code is pretty much like this

<div class="place" style="top: 4px;">
    <span class>text</span> 
    <span class>text</span>
    <span class>text</span>
</div>

For example with this code

let text = document.querySelector("div.place").textContent; //grab all text

I get all the text like this: thisisanexampletext
Is there a way to get text with spaces after each word?
like this: this is an example text

Can you give us full example using code snippet please? Attribute textContent returns text content as it is - with whitespaces. — Jax-p
– Jax-p, Commented Nov 24, 2021 at 13:08
@decpk not if the text is divided in different childs and there's some css going on. — pytness
– pytness, Commented Nov 24, 2021 at 13:11
can you check if document.querySelector("div.place").innerText will do? — ciekals11
– ciekals11, Commented Nov 24, 2021 at 13:18

Maik Lowrey · Accepted Answer · 2021-11-24 14:12:23Z

1

First you have to collect all the span elements. You then iterate through this collection and can read the text from each element with innerHTML / innerText. You push this into an array and at the end you can make the desired string out of it with the array function join().

let t = document.querySelectorAll("div.place span");

const text = [];
for(let i = 0; i < t.length; i++) {   
   text.push(t[i].innerHTML);
}

console.log(text.join(' '));

<div class="place" style="top: 4px;">
    <span class>text</span> 
    <span class>text</span>
    <span class>text</span>
</div>

answered Nov 24, 2021 at 14:12

Maik Lowrey

17.8k8 gold badges55 silver badges101 bronze badges

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

Comments

Tami · Accepted Answer · 2022-11-14 07:47:37Z

0

It is also possible in this way..

let t = document.querySelectorAll("div.place span");

for(let i = 0; i < t.length; i++) {   
   t[i].innerHTML += " ";
}

<div class="place" style="top: 4px;">
    <span class>text</span> 
    <span class>text</span>
    <span class>text</span>
</div>

edited Nov 14, 2022 at 7:47

answered Nov 9, 2022 at 15:14

Tami

164 bronze badges

Collectives™ on Stack Overflow

How to get text from an element with space in javascript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related