Visible селекторы

:visible селекторы беттегі барлық көрінетін элементтерді таңдайды. visibility: hidden немесе opacity: 0 бар элементтер көрінетін деп саналады, себебі олар орналасуда орын алады. Элементтер көрінетін деп саналады, егер олар құжатта орын алса. Көрінетін элементтердің биіктігі және ені 0-ден өзгеше болады. :visible CSS спецификациясына жатпайтындықтан, заманауи браузерлерде өнімділікті жақсарту үшін алдымен таза css-селекторын қолданып элементтерді сүзгіден өткізіп, содан кейін .filter(':visible') қолдануға болады. Элементтердің көрінуін басқа әдістер арқылы бақылау, мысалы, класс арқылы, жақсы өнімділікке қол жеткізуге мүмкіндік береді.

Синтаксис

Көрінетін элементтерді былай таңдаймыз:

javascript$(':visible');

Мысал

Түймені басқанда көрінбейтін шаршыларды көрсетейік. "Көрінетін" шаршыларды басқанда олардың фоны сары түске өзгереді:

html<button id="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');
});

Сондай-ақ қараңыз

  • hidden селекторы,
    ол беттегі барлық жасырын элементтерді таңдайды
  • filter әдісі,
    ол жиындағы элементтерді берілген селектор бойынша сүзгіден өткізеді
  • show әдісі,
    ол жасырын элементтерді біртіндеп көрсетеді