Wie Text innerhalb <option> Tag richtig entkommt?

Question

Wenn Sie nicht vertrauenswürdigen Text in ein HTML-Dokument einfügen, müssen Sie bestimmte Sonderzeichen (z. B. <, &, "usw.) (" für in Anführungszeichen gesetzte Attribute) einfügen. Zum Beispiel:

<div>Some tags are <b> and <div></div> 

wird:

<div>Some tags are &lt;b&gt; and &lt;div&gt;</div> 

(One die Notwendigkeit & gt debattieren kann, aber das ist hier nicht relevant.)

Das ist großartig, aber was ist innerhalb einer Option-Tag? Wenn ich möchte, dass der Text "< / Option >" ist, wie mache ich das?

funktioniert das nicht:

<option>&lt;&sol;option&gt;</option> 

Was ich finde, ist, dass die HTML-Entitäten, (& lt ;, & gt ;, etc.) fallen gelassen werden. Ich habe sowohl Chrome als auch Firefox ausprobiert. Ich nehme an, dies hängt mit der Tatsache zusammen, dass das Options-Tag keine verschachtelten Tags enthalten darf. Google hat mich dabei enttäuscht. :(

Und eine weitere Frage: Da <Option> hat spezielle Flucht Verhalten, wie oben gezeigt, und wir wissen, <Skript> sein eigenes Verhalten hat Gibt es eine vollständige Liste irgendwo aller HTML-Tags, die spezielle Flucht Verhalten. und was es Regeln?

Dank.

Answer 1

Wenn ich Ihre Frage richtig zu verstehen, wie sie in dem folgenden Schnipsel demonstriert, können Sie HTML-Entitäten innerhalb des <option> Tages völlig in Ordnung (getestet auf Firefox, Chrome & Safari) entkommen

So können Sie den Text </option> in einem Options-Tag haben. Dies wird getan, um die HTML-Entitäten verwendet werden, die die < und > Zeichen darstellen

Im Wesentlichen ist es die gleiche wie mit:

<option></option></option> 

Obwohl die Mitte </option> nicht als Schluss-Tag behandelt, sondern es wird gezeigt auf diese Weise im Browser

Als Randbemerkung, die einzige Einschränkung mit <option>-Tags, wenn Zeichen Flucht legt in den :before und :after CSS Pseudo-Elementen. W3 schlägt vor, dass Sie Inhalt nicht an den <option>-Tag mit diesen Pseudoelementen voranstellen/anhängen können. Obwohl aus irgendeinem Grund in 48 Firefox diese InFact funktionierts

#css-option:before { 
 
    content: "any text"; 
 
}

<select> 
 
    <option>&lt;/option&gt;</option> 
 
    <option>&#60;/option&#62;</option> 
 
    <option>&lt;&sol;option&gt;</option> 
 
    <option id="css-option"></option> 
 
</select>