Обнаруживать, скрывается ли html-родитель

Я хотел бы определить, когда скрывается определенный HTML-элемент на странице. Обычно это происходит из-за скрытия родительского элемента (возможно, нескольких уровней). Есть простой способ обнаружить это. Или мне нужно пересечь DOM и проверить каждого родителя?

Ответ 1

$(foo).is(":hidden")

может понять это для вас в текущих версиях jQuery.

Ответ 2

Вы можете просто проверить, есть ли :hidden, например:

$(".selector:hidden").length > 0
//or
$(".selector").is(":hidden")

Это работает, если родитель скрыт или какой-либо родительский элемент или элемент напрямую... пока сам элемент не имеет измерений, он :hidden.

Ответ 3

Как это:

alert($('#test1').is(":visible"));

#test {
  display: none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="test">
  <div id="test1">
    test
  </div>
</div>

Ответ 4

jQuery использует offsetHeight. Это работает в большинстве браузеров. Но вы можете проверить, что без jQuery тоже.