Bei der Erstellung des id Attribute für HTML-Elemente, welche Regeln gibt es für den Wert?
Aber in HTML5 nicht erforderlich? Siehe vorherige Antworten.
Antworten
Zu viele Anzeigen?
Tazwar Utshas
Punkte
811
Kanishka Panamaldeniya
Punkte
16652
Für HTML5 :
Der Wert muss unter allen IDs im Home-Teilbaum des Elements eindeutig sein Teilbaum des Elements eindeutig sein und mindestens ein Zeichen enthalten. Der Wert darf keine keine Leerzeichen enthalten.
Mindestens ein Zeichen, keine Leerzeichen.
Dies öffnet die Tür für gültige Anwendungsfälle wie die Verwendung von Akzentzeichen. Es gibt uns auch viel mehr Munition, mit der wir uns in den Fuß schießen können, da man jetzt id Werte, die sowohl mit CSS als auch mit JavaScript Probleme verursachen, wenn Sie nicht sehr vorsichtig sind.
Können Sie hinzufügen. den Hinweis auf das Zitat in Ihrer Antwort? (Aber ohne "Bearbeiten:", "Aktualisieren:" oder ähnlich - die Antwort sollte so aussehen, als wäre sie heute geschrieben worden).
Web Designer cum Promoter
Punkte
1324
- IDs eignen sich am besten für die Benennung von Teilen Ihres Layouts, daher sollten Sie für ID und Klasse nicht denselben Namen vergeben
- ID erlaubt alphanumerische Zeichen und Sonderzeichen
- aber vermeiden Sie die Verwendung der
# : . * !Symbole - Leerzeichen sind nicht erlaubt
- nicht mit Zahlen oder einem Bindestrich gefolgt von einer Ziffer beginnen
- Groß- und Kleinschreibung beachten
- die Verwendung von ID-Selektoren ist schneller als die Verwendung von Klassenselektoren
- Bindestrich "-" verwenden (der Unterstrich "_" kann auch verwendet werden, ist aber nicht geeignet für SEO ) für lange CSS-Klassen- oder Id-Regelnamen
- Wenn eine Regel einen ID-Selektor als Schlüsselselektor hat, fügen Sie den Tag-Namen nicht zur Regel hinzu. Da IDs eindeutig sind, würde das Hinzufügen eines Tag-Namens den Abgleichprozess unnötig verlangsamen.
- In HTML5 kann das id-Attribut für jedes HTML-Element verwendet werden. In HTML 4.01 kann das id-Attribut nicht mit verwendet werden:
<base>, <head>, <html>, <meta>, <param>, <script>, <style>, and <title>.
NVRM
Punkte
8487
Seit ES2015 können wir auch verwenden fast alle Unicode-Zeichen für ID's, wenn der Zeichensatz des Dokuments auf UTF-8 eingestellt ist.
Testen Sie hier: https://mothereff.in/js-variables
Lesen Sie mehr darüber: Gültige JavaScript-Variablennamen in ES2015
In ES2015 müssen Bezeichner mit $, _ oder einem Symbol mit der Unicode abgeleiteten Kerneigenschaft ID_Start beginnen.
Der Rest des Bezeichners kann $, _, U+200C Nullbreite Nicht-Joiner, U+200D Null-Breite-Joiner oder jedes Symbol mit der von Unicode abgeleiteten Kerneigenschaft ID_Continue enthalten.
const target = document.querySelector("div").id
console.log(
target
)
document.getElementById(target).style.backgroundColor = "black"
div {
border: 1px black solid;
width: 100%;
height: 200px
}
<div id="HECOMETH">Sollten Sie es verwenden? Wahrscheinlich keine gute Idee!
Lesen Sie mehr darüber: JavaScript: Syntaxfehler fehlt } nach Funktionskörper
Joel Wembo
Punkte
759
119 Stimmen
Dies unterscheidet sich zwischen HTML5 und früheren Versionen der Spezifikation. Ich habe es hier erklärt: mathiasbynens.be/notes/html5-id-class
5 Stimmen
Mir ist aufgefallen, dass SharePoint 2010 einen Wert wie diesen - {8CC7EF38-31D8-4786-8C20-7E6D56E49AE2}-{E60CE5E2-6E64-4350-A884-654B72DA5A53} für eine dynamisch generierte Tabelle innerhalb eines Webparts zuweist und eine Seite, die einen ID-Wert dieser Art enthält, in keinem der gängigen Browser bricht. Der Umgang mit solchen ID-Werten über JavaScript ist allerdings schwierig - mvark.blogspot.in/2012/07/
4 Stimmen
HTML4- und HTML5-Anforderungen für
IDWerte sind sehr unterschiedlich. Hier ist eine schnelle und vollständige Übersicht über HTML5IDRegeln: stackoverflow.com/a/31773673/35972766 Stimmen
Bitte beachten Sie: Wenn Sie so vorgehen, wie es in einigen Antworten steht, und einen Punkt verwenden (
**.**)mit jQuery wird Sie in ziemliche Schwierigkeiten bringen, zum Beispiel, wenn Sie<input id="me.name" />y luego$("#me.name").val()wird jQuery veranlassen, nach einer<me>Tag mit der Klasse.namewas niemand wirklich will!3 Stimmen
@SamSwift Nein, Sie müssen nur Sonderzeichen als Die Ärzte sagen . Bitte prüfen Sie dies Online-Demo .
0 Stimmen
Ich weiß, der OP ist über die Generierung von gültigen IDs fragen (und nicht, wie man jQuery ein vorhandenes DOM), aber, @Faust's Kommentar Weg unten wird sein also nützlich für andere, die vielleicht auf die gleiche Weise gegoogelt haben wie ich. Mit seiner Technik: Ich konnte erfolgreich nach Elementen wie diesem (mit einem Leerzeichen) suchen:
<div id="Usr_order #">...mit einer jQuery-Anweisung wie dieser:$([id='Usr_order #'])1 Stimmen
@mvark GUIDs sind heiß, aber ich habe herausgefunden, dass mit base64 kodierte GUIDs noch heißer sind.
0dea65ca-eac3-489a-944c-0c522b609f78wird kompakt dargestellt alsymXqDcPqmkiUTAxSK2CfeA.