html - sono - meta tag seo




I tag a chiusura automatica(non vuoto) sono validi in HTML5? (4)

Il validatore del W3C non ama i tag di chiusura automatica (quelli che terminano con " /> ") su elementi non-void . (Gli elementi vuoti sono quelli che potrebbero non contenere mai alcun contenuto.) Sono ancora validi in HTML5?

Alcuni esempi di elementi void accettati :

<br />
<img src="" />
<input type="text" name="username" />

Alcuni esempi di elementi non vuoti respinti :

<div id="myDiv" />
<span id="mySpan" />
<textarea id="someTextMessage" />

Nota: il validatore W3C accetta in realtà tag di chiusura automatica vuoti: l'autore aveva originariamente un problema a causa di un semplice errore di battitura ( \> invece di /> ). Tuttavia, i tag a chiusura automatica non sono validi al 100% in HTML5 in generale e le risposte elaborano il problema dei tag che si chiudono automaticamente in vari formati HTML.


Come ha sottolineato Nikita Skvortsov, un div di chiusura automatica non verrà convalidato. Questo perché un div è un elemento normale , non un elemento void . Secondo la specifica HTML5 , i tag che non possono contenere alcun contenuto (noti come elementi void ) possono essere a chiusura automatica *. Questo include i seguenti tag:

area, base, br, col, embed, hr, img, input, 
keygen, link, meta, param, source, track, wbr

"/" È completamente opzionale sui tag sopra, tuttavia, <img/> non è diverso da <img> , ma <img></img> non è valido.

* Nota: gli elementi estranei possono anche essere a chiusura automatica, ma non credo che rientrino in questa risposta.


HTML5 si comporta fondamentalmente come se la barra finale non fosse presente. Non esiste un tag a chiusura automatica nella sintassi HTML5.

  • I tag che si chiudono automaticamente su elementi non vuoti come <p/> , <div/> non funzioneranno affatto. La barra finale verrà ignorata e questi verranno trattati come tag di apertura. Questo potrebbe portare a problemi di nidificazione.

    Questo è vero indipendentemente dal fatto che ci sia spazio bianco davanti alla barra: anche <p /> e <div /> non funzionano per lo stesso motivo.

  • I tag che si chiudono automaticamente su elementi void come <br/> o <img src="" alt=""/> funzioneranno, ma solo perché la barra finale viene ignorata e, in questo caso, ciò comporta il comportamento corretto.

Il risultato è che tutto ciò che ha funzionato nel vecchio "XHTML 1.0 servito come testo / html" continuerà a funzionare come prima: le barre finali sui tag non void non sono state accettate neanche mentre la barra finale sugli elementi void ha funzionato.

Ancora una nota: è possibile rappresentare un documento HTML5 come XML e talvolta viene soprannominato "XHTML 5.0". In questo caso si applicano le regole XML e i tag a chiusura automatica verranno sempre gestiti. Dovrebbe sempre essere servito con un tipo mime XML.


In pratica, l'utilizzo di tag a chiusura automatica in HTML dovrebbe funzionare esattamente come ci si aspetterebbe. Ma se sei preoccupato di scrivere HTML5 valido , dovresti capire come si comporta l'uso di tali tag all'interno dei due diversi moduli di sintassi che puoi usare. HTML5 definisce sia una sintassi HTML che una sintassi XHTML, che sono simili ma non identiche. Quale viene utilizzato dipende dal tipo di media inviato dal server web.

Più che probabile, le tue pagine sono servite come text/html , che segue la sintassi HTML più indulgente. In questi casi, HTML5 consente a determinati tag di inizio di avere un'opzione facoltativa / prima che termini>. In questi casi, il / è facoltativo e ignorato, quindi <hr> e <hr /> sono identici. La specifica HTML chiama questi "elementi vuoti" e fornisce un elenco di quelli validi. A rigor di termini, l'opzione / è valida solo nei tag di inizio di questi elementi di vuoti; per esempio, <br /> e <hr /> sono HTML5 validi, ma <p /> no.

Le specifiche HTML5 fanno una chiara distinzione tra ciò che è corretto per gli autori HTML e per gli sviluppatori di browser web, con il secondo gruppo che deve accettare tutti i tipi di sintassi "legacy" non valida. In questo caso, significa che i browser conformi a HTML5 accetteranno tag auto-chiusi illegali, come <p /> , e li renderanno come probabilmente ti aspetti. Ma per un autore, quella pagina non sarebbe valida HTML5. (Ancora più importante, l'albero DOM che si ottiene dall'uso di questo tipo di sintassi illegale può essere seriamente rovinato, i tag auto-chiusi <span /> , ad esempio, tendono a complicare molto le cose).

(Nel caso insolito che il tuo server sappia come inviare file XHTML come tipo MIME XML, la pagina deve essere conforme alla DTD XHTML e alla sintassi XML. Ciò significa che i tag auto-chiudenti sono richiesti per quegli elementi definiti come tali.)


Sarei molto attento con i tag di chiusura automatica come dimostra questo esempio:

var a = '<span/><span/>';
var d = document.createElement('div');
d.innerHTML = a
console.log(d.innerHTML) // "<span><span></span></span>"

La mia sensazione istintiva sarebbe stata <span></span><span></span> invece







w3c-validation