Как установить для свойства отображения дочернего элемента значение none, если для родительского элемента установлено значение block - PullRequest
0 голосов
/ 27 апреля 2020

У меня есть Bootstrap Jumbotron, обертывающий список Bootstrap. Jumbotrom по умолчанию настроен на скрытие:

<div class="jumbotron" id="shoppingCart" style="display: none">
  <h1 class="display-4" >Checkout</h1>
  <p class="lead" id = "checkOutIntro">This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
  <hr class="my-4">
  <p>Your shoppping cart :</p>

Каждый элемент списка также устанавливается как скрытый. Идея состоит в том, чтобы сделать элемент списка видимым функцией JS, когда это необходимо.

<!--Each item will be hidden until its populated by purchase.js-->
<li class="list-group-item d-flex justify-content-between align-items-center" style="display: none" id = "purchaseItem 2">
Dapibus ac facilisis in
<span class="badge badge-primary badge-pill">2</span>

Функция изменяет атрибут отображения элемента списка:

document.getElementById("purchaseItem " + purchase.paintingNumber).style.display = "block";

Однако, когда я делаю родительский div Jumbotrom видимым, весь список также виден, независимо от встроенной команды элемента списка display:none.

Можно ли установить для свойства отображения дочернего элемента значение нет / блок, если для свойства отображения родительского элемента установлено противоположное значение?

1 Ответ

1 голос
/ 27 апреля 2020

попробуйте переопределить другие внешние определения, используя тег ! Important после свойства

document.getElementById("purchaseItem " + purchase.paintingNumber).style.display = "block !important";

Подробнее об этом читайте в MDN web docs

...