Селектор 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');
});

Инчунин бубинед