Czy pisanie tagów zamykających elementy nie jest tradycyjnie pustą złą praktyką?
Zauważyłem, że jQuery (a może Firefox) zmieni moje <span class="presentational"></span> into <span class="presentational" />
8 answers
Zakładam, że twoje pytanie ma związek z Czerwonym ukośnikiem na samozamykających się elementach podczas przeglądania source w Firefoksie. Jeśli tak, natknąłeś się na jedną z najbardziej gwałtownych, ale jednocześnie pasywnie agresywnych debat w wojnie browser maker vs.Web developer wars. XHTML to nie tylko znaczniki dokumentu. Chodzi również o to, jak dokumenty mają być podawane przez Internet.
Zanim zacznę, staram się tu nie brać stron.
Specyfikacja XHTML 1.1 mówi, że serwer WWW powinien obsługiwać XHTML z zawartością typu aplikacji / xhtml+xml. Firefox wyróżnia te końcowe ukośniki jako nieprawidłowe, ponieważ dokument jest obsługiwany jako tekst / html, a nie aplikacja / xhtml+xml. Weźmy te dwa przykłady; identyczne znaczniki, jeden służył jako application / xhtml+xml, drugi jako text / html.
Http://alanstorm.com/testbed/xhtml-as-html.php
Http://alanstorm.com/testbed/xhtml-as-xhtml.php
Firefox flags the końcowy ukośnik w znaczniku meta jako nieprawidłowy dla dokumentu obsługiwanego za pomocą text / html i poprawny dla dokumentu obsługiwanego za pomocą application/xhtml+xml.
Dlaczego jest to kontrowersyjne
Dla programisty przeglądarki, sens XHTML jest taki, że możesz traktować swój dokument jako XML, co oznacza, że jeśli ktoś wyśle Ci coś, co nie jest poprawne, Specyfikacja mówi, że nie musisz tego analizować. Tak więc, jeśli dokument jest obsługiwany jako application / xhtml+xml i ma niezbyt dobrze uformowaną treść, programista może powiedzieć "nie mój problem". Możesz to zobaczyć tutaj
Http://alanstorm.com/testbed/xhtml-not-valid.php
Gdy dokument jest podawany jako tekst/html, Firefox traktuje go jako zwykły stary dokument HTML i używa procedury parsowania wybaczania, naprawiania go dla Ciebie
Http://alanstorm.com/testbed/xhtml-not-valid-as-html.php
Więc, dla twórcy przeglądarki, XHTML serwowany jako tekst / html jest niedorzeczny, ponieważ nigdy nie jest traktowany jako XML przez renderowanie przeglądarki silnik.
Kilka lat temu programiści szukający czegoś więcej niż tylko tagowania małp (Zastrzeżenie: włączam się jako jeden z nich) zaczęli szukać sposobów na opracowanie najlepszych praktyk, które nie obejmowały trzykrotnie zagnieżdżonych tabel, ale nadal pozwalały na atrakcyjne wrażenia projektowe. Oni / my przyczepiliśmy się do XHTML / CSS, ponieważ W3C powiedział, że to przyszłość, a jedynym innym wyborem był świat, w którym pojedynczy sprzedawca (Microsoft) kontrolował specyfikację znaczników defacto. Prawdziwe zło jest pojedynczy sprzedawca i nie tyle Microsoft. Przysięgam.
Więc gdzie są kontrowersje? Istnieją dwa problemy z application / xhtml+xml. Pierwszym z nich jest Internet Explorer. Istnieje starszy błąd / funkcja w IE, gdzie zawartość serwowana jako aplikacja / xhtml+xml poprosi użytkownika o pobranie dokumentu. Jeśli próbowałeś odwiedzić xhtml-as-xhtml.php wymienione powyżej z IE to jest prawdopodobne, co się stało. Oznacza to, że jeśli chcesz użyć application / xhtml+xml, musisz browser sniff dla IE , sprawdź nagłówek Accepts i podawaj application / xhtml+xml tylko tym przeglądarkom, które go akceptują. Jest to nie tak trywialne Jak się wydaje, aby się dobrze, a także było sprzeczne z zasadą "napisz raz", do której dążyli twórcy stron internetowych.
Drugim problemem jest surowość XML. Jest to, znowu, jeden z tych problemów podatnych na płomienie, ale są ludzie, którzy uważają, że pojedynczy zły tag lub pojedynczy znak nieprawidłowo zakodowany nie powinien powodować, że użytkownik nie zobaczy dokument, który chcą. Innymi słowy, tak, spec mówi, że powinieneś przestać przetwarzać XML, jeśli nie jest dobrze uformowany, ale użytkownik nie dba o spec, obchodzi go, że strona jego kota jest zepsuta.
Dodając jeszcze więcej benzyny do problemu jest XHTML 1.0 (nie 1.1) spec mówi, że dokumenty XHTML mogą być podawane jako tekst/html, zakładając, że przestrzegane są pewne wytyczne dotyczące zgodności. Rzeczy takie jak tag img samo się zamyka i tym podobne. Słowo kluczowe tutaj jest maj . W RFC speak, may oznacza opcjonalne. Firefox zdecydował się nie traktować dokumentów obsługiwanych przez doctype XHTML, ale typ zawartości tekstu / html jako XHTML. Jednak walidator W3C z radością zgłosi te dokumenty jako ważne.
Zostawię czytelnika, aby zastanowił się nad równoczesnym zdumieniem / horrorem kultury, która pisze dokument, aby zdefiniować, co mają na myśli przez słowo may .
Moving Forward
Wreszcie, to jest to, co cały HTML 5 chodzi o XHTML stał się tak politycznym gorącym ziemniakiem, że grupa ludzi, którzy chcieli przesunąć język do przodu, postanowiła pójść w innym kierunku. Stworzyli spec dla HTML 5. Obecnie jest to hashowane w W3C i oczekuje się, że zakończy się w następnej dekadzie. W międzyczasie dostawcy przeglądarek wybierają i wybierają funkcje ze specyfikacji w toku i wdrażają je.
Aktualizacje z komentarzy
W komentarzach, Alex zwraca uwagę, że jeśli chcesz coś powąchać, powinieneś sprawdzić nagłówek Accept, aby sprawdzić, czy application/xhtml+xml jest akceptowane przez user agent.
To jest absolutnie poprawne. Ogólnie rzecz biorąc, jeśli masz zamiar powąchać, powąchaj dla funkcji, a nie dla przeglądarki.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-23 12:02:20
Dodatek do innych odpowiedzi: w IE, posiadanie elementów takich jak <span /> w marce spowoduje wszelkiego rodzaju problemy z metodami trawersowania DOM w JavaScript . Spójrz na następujący dokument XHTML:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Test</title>
<script type="text/javascript">
function show() {
var span = document.getElementById("span");
alert(span.innerHTML);
}
</script>
</head>
<body onload="show();">
<p id="p1">Paragraph containing some text followed by
an empty span<span id="span"/></p>
<p id="p2">Second paragraph just containing text</p>
</body>
</html>
Chodzi o to, że gdy strona zostanie załadowana, JavaScript otrzyma odniesienie do pustego zakresu i wyświetli jego zawartość HTML. To będzie pusty ciąg, prawda? Nie w IE nie będzie. w IE dostajesz całą zawartość po całym dokument:
</P>
<P id=p2>Second paragraph just containing text</P>
Również druga <p> pojawia się w kolekcji span ' S childNodes. Ten sam <p> znajduje się również w zbiorze childNodes ciała, co oznacza, że węzeł może mieć wiele rodziców . Nie jest to zbyt dobra wiadomość dla skryptów, które polegają na przemierzaniu DOM.
Ja również blogowałem o tym.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-10-15 16:10:45
Tak. Tak. W niektórych przypadkach spowoduje to problemy ze starymi przeglądarkami.
<script type='text/javascript' src='script.js' />
W tym przypadku stara przeglądarka może nie zrozumieć, że tag <script> został zakończony.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2008-12-08 06:03:05
Serwowane jako application / xhtml+xml, oznacza tworzenie elementu span bez zawartości.
Serwowane jako text / html, oznacza tworzenie elementu span, w którym zawartość elementu podąża za tym znacznikiem, dopóki nie zostanie napotkany znacznik lub inny znacznik (lub EOF), który domyślnie zamyka element. tzn. w tym przypadku oznacza to samo co .
Na bok: HTML 5 definiuje zarówno serializacje HTML jak i XHTML, więc nie wpływa to na ten problem w jeden sposób lub kolejny. Wymaga, podobnie jak XHTML 1.1, aby XHTML był obsługiwany jako application / xhtml+xml, w przeciwieństwie do XHTML 1.0. W efekcie jednak nic to nie zmienia, ponieważ wszystkie przeglądarki traktują dowolną wersję XHTML serwowaną jako text / html jako tag soup.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2008-12-09 09:44:49
Warto również zauważyć, że deklaracja <?xml ...?> przed doctype rzuca IE w tryb quirks.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-02-03 16:47:59
Zobacz notatkę na ten temat z grupy roboczej XHMTL: http://www.w3.org/TR/xhtml-media-types/
W skrócie - jest w porządku, jeśli twój XHTML będzie traktowany jako XHTML. Jeśli zamierzasz udawać, że jest to HTML (co musisz zrobić, jeśli chcesz, aby został załadowany przez Internet Explorer (w tym wersję 8, najnowszą w momencie pisania), musisz przeskoczyć przez obręcze).
Obręcze są na tyle irytujące, że polecam większości ludzi trzymać się HTML 4.01.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-02-07 13:29:08
Należy wyraźnie powiedzieć, że w HTML nie ma samozamykających się znaczników, więc gdy przeglądarka zdecyduje się traktować XHTML jako HTML, nie rozpozna, że znacznik jest zamknięty. Nie jest to problem dla tagów, które nie muszą być zamknięte w HTML, jak <img>, ale oczywiście źle z tagami jak <span>.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-08-03 12:48:35
Ogólnie nie jest problemem użycie skrótu dla pustych elementów, ale są pewne wyjątki, w których może to powodować problemy.
<script> jest ważnym elementem, który należy zamknąć </script>, aby uniknąć problemów.
Innym jest <meta>, który działa znacznie lepiej z pająkami napisanymi jako <meta></meta> zamiast <meta />
Nie do końca pytanie, ale związane, pod względem formatowania, wersje IE mają problemy tylko z pustymi elementami, takimi jak <div></div> lub <div />. W tym przypadku <div> </div> jest wymagane do utrzymania formatowania.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2008-12-08 06:08:42