Селектор visible

Селектор :visible саҳифадаги барча кўринувчи элементларни танлайди. visibility: hidden ёки opacity: 0 билан элементлар кўринувчи ҳисобланади, чунки улар макетда жой олур. Элементлар кўринувчи ҳисобланади, агар улар ҳужжатда жой олса. Кўринувчи элементларнинг баландлиги ва эни 0 дан фарқ қилади. :visible CSS спецификациясига кирмагани сабабли, замонавий браузерларда самарадорликни ошириш учун аввал элементларни соф css-селектори билан фильтрлаш, сўнгра .filter(':visible') ни қўллаш яхшироқдир. Элементларнинг кўринишини бошқа усуллар билан кузатиш, масалан, синф ёрдамида, яхшироқ самарадорликни таъминлаши мумкин.

Синтаксис

Кўринувчи элементларни шундай танлаймиз:

javascript$(':visible');

Мисол

Кнопкани босганда кўринмайдиган квадратчаларни кўрсатамиз. "Кўринувчи" квадратчаларни босганда уларнинг орқа фони сариқ рангга айланади:

html<button id="show">show</button>
<div></div>
<div style="display:none;"></div>
<div></div>
<div></div>
<div style="display:none;"></div>

cssdiv {
  width: 40px;
  height: 40px;
  margin: 5px;
  border: 2px outset green;
  float: left;
}

javascript$('div:visible').click(function() {
  $(this).css('background', 'yellow');
});

$('#show').click(function() {
  $('div:hidden').show('slow');
});

Шунингдек қаранг