Kevin Powell - Community•2y ago

Hide Empty Row

I have a very simple 3 x 10 grid, but depending on the input I want to hide various rows that do not contain any data. Here is the HTML

4 Replies

vince•2y ago

You didn't post any html, but this seems easy enough to psuedocode. Depending on the content, you can check if a certain html element has any text to it.

if (element.innerText === "") {
  element.style.display = "none";
}

if (element.innerText === "") {
  element.style.display = "none";
}

How to do it if you want to check if the html element has any children elements:

if (!element.hasChildNodes()) {
  element.style.display = "none";
}

if (!element.hasChildNodes()) {
  element.style.display = "none";
}

Mannix•2y ago

if it's trully empty you can use :empty to style it

Mannix•2y ago

https://developer.mozilla.org/en-US/docs/Web/CSS/:empty

:empty - CSS: Cascading Style Sheets | MDN

The :empty CSS pseudo-class represents any element that has no children. Children can be either element nodes or text (including whitespace). Comments, processing instructions, and CSS content do not affect whether an element is considered empty.

vince•2y ago

Oh I didn't know that was a thing, neat!

Gaming

Programming

Hide Empty Row