Search jQuery

jQuery Forum

Using jQuery

pxsteiner

How to remove whitespace after/inside <div>?

in Using jQuery • 8 months ago

Assume the following code:

<div class="foobar">
"whitespace"
<p>....</p>
</div>

"whitespace" is not the text but a whitespace as indicated in Firefox WebDeveloper.

How can I get rid of every whitespace inside after a <div class=foobar"> and the first <p> with jQuery?

Replies(7)

jakecigar

Re: How to remove whitespace after/inside <div>?

8 months ago

jQuery doesn’t do that. You have to go native.

JΛ̊KE

pxsteiner

Re: How to remove whitespace after/inside <div>?

6 months ago

I have to revert to this thread.

I did not found a solution.

Have a look at the attached snapshot (from Firefox WebDeveloper pane) with two (independent) combinations:

I cannot imagine that jQuery does not offer a way to remove these "whitespaces"

If possible all

<p>"whitespace"</p>

elements should be removed in the second example

Attachments

whitesspace snapshots.png
Size : 6.13 KB Downloads : 31 Download

jakecigar

Re: How to remove whitespace after/inside <div>?

6 months ago

https://jsfiddle.net/jakecigar/zxmvfdL7/ uses native js.

jquery does NOT have give access to childNodes.

JΛ̊KE

pxsteiner

Re: How to remove whitespace after/inside <div>?

6 months ago

Sorry, your solution does NOT work.

Ok, lets go a little bit closer to a real world example:

https://blogs.systweak.com/21-best-android-optimizer-and-booster-apps/

RIght-click in Firefox on Subheadline "2. CCleaner" and select "Inspect element".

As you see the element following the <h3> element is NOT removed with your slightly adjusted code:

document.querySelectorAll(".content-area").forEach(div => {
  div.childNodes.forEach(node => {
    if (node.nodeType === 3 && node.textContent.match(/^\s*$/))
      node.remove()
  })
})

Any further suggestions?

Thank you

jakecigar