Różnica między puste i puste pseudoklasy

Question

jaka jest różnica między: puste i: puste (CSS Selectors Level 4 draft)? Poza tym, że puste obecnie działa tylko w przeglądarce Firefox.

div div{ 
 
    
 
    width:100px; 
 
    height:100px; 
 
    display:inline-block; 
 
    margin:5px; 
 
    } 
 
div.emptyCell:empty{ 
 
    
 
    background:#009688; 
 
    
 
    } 
 
div.blankCell:blank{ 
 
    
 
    background:#3F51B5; 
 
    
 
    }

<div><div class="emptyCell"><!-- nothing but a comment--></div> 
 
<div class="emptyCell"></div> 
 
<div class="emptyCell"><!-- nothing but a comment--></div> 
 
<div class="emptyCell"></div> 
 
    </div> 
 
<div> 
 
<div class="blankCell"></div> 
 
<div class="blankCell"><!-- nothing but a comment--></div> 
 
<div class="blankCell"></div> 
 
<div class="blankCell"><!-- nothing but a comment--></div> 
 
    </div>

Answer 1

: blank pseudo-klasy opiera się na: pusty pseudo-klasie. Podobnie jak : pusty,: blank wybierze elementy, które nie zawierają niczego lub zawierają tylko komentarz HTML. Ale: blank również wybierze elementy zawierające białe spacje, które: puste nie będą.

css-tricks :blank

Również From the W3c Working Draft on selectors level 4:

parametru: puste pseudoklasa jest identyczny z empty pseudoklasa, wyjątkiem tego, że dodatkowo obejmuje characters affected by whitespace processing [CSS3TEXT] określenia, czy element jest pusty.

przykład:

na przykład następnego elementu odpowiada: pusty, ale nie: pusta, , gdyż zawiera on co najmniej jeden linebreak i ewentualnie inne odstępy:

<p> 
</p> 

Answer 2

:empty będzie pasować do wszystkich podanych elementów, ponieważ węzeł elementu, który zawiera tylko węzły komentarza, jest w zasadzie ja jako węzeł elementu bez dzieci, jeśli chodzi o CSS. Właśnie dlatego nie widzisz różnicy między meczami.

Różnica polega na tym, że :blank dopasowuje elementy składające się wyłącznie ze znaków białych znaków, które w innym przypadku nie są uważane za :empty. Dzieje się tak dlatego, że węzły białych znaków są w rzeczywistości tylko węzłami tekstowymi, które zawierają tylko białe znaki, a element z węzłem tekstowym węzeł nie jest pustym elementem. Ważne jest jednak, aby zauważyć, że CSSWG rozważa zmianę :empty, tak aby pasowała do elementów, które zawierają tylko białe spacje, eliminując potrzebę stosowania osobnej i myląco nazwanej pseudoklasą o kodzie :blank. Zostało to rozwiązane just a few weeks ago. W związku z tym :blank, jak opisano w bieżących wersjach WD, może lub nie może istnieć w następnym WD, który zamierzają opublikować wkrótce, ponieważ ostatnia aktualizacja WD nastąpiła ponad dwa lata temu: ponad dwa lata temu.

Jeśli zdarza się, że odpowiedź na to pytanie będzie:

:blank była oryginalna propozycja selektorów poziomie 4 do dopasowania elementów, które albo nie mają treści, czy tylko zawierają spacje. Od tego czasu został usunięty, a jego funkcjonalność została włączona do poziomu 4 :empty, co eliminuje potrzebę osobnej pseudo-klasy o myląco nazwie.