<div id="example-value"> o <div id="example_value"> ?
Diese Website und Twitter verwenden den ersten Stil. Facebook und Vimeo - den zweiten.
Welche verwenden Sie und warum?
Antworten
Zu viele Anzeigen?
Verwenden Sie Bindestriche, um die Isolierung zwischen HTML und JavaScript zu gewährleisten.
Warum? siehe unten.
Bindestriche dürfen in CSS und HTML verwendet werden, nicht aber für JavaScript-Objekte.
Viele Browser registrieren HTML-Kennungen als globale Objekte auf dem Fenster-/Dokumentenobjekt, was bei großen Projekten zu einem echten Problem werden kann.
Aus diesem Grund verwende ich Namen mit Bindestrichen, damit die HTML-IDs nicht mit meinem JavaScript in Konflikt geraten.
Bedenken Sie Folgendes:
message.js
message = function(containerObject){
this.htmlObject = containerObject;
};
message.prototype.write = function(text){
this.htmlObject.innerHTML+=text;
};html
<body>
<span id='message'></span>
</body>
<script>
var objectContainer = {};
if(typeof message == 'undefined'){
var asyncScript = document.createElement('script');
asyncScript.onload = function(){
objectContainer.messageClass = new message(document.getElementById('message'));
objectContainer.messageClass.write('loaded');
}
asyncScript.src = 'message.js';
document.appendChild(asyncScript);
}else{
objectContainer.messageClass = new message(document.getElementById('message'));
objectContainer.messageClass.write('loaded');
}
</script>Wenn der Browser HTML-IDs als globale Objekte registriert, schlägt die obige Funktion fehl, weil die Nachricht nicht "undefiniert" ist, und es wird versucht, eine Instanz des HTML-Objekts zu erstellen. Indem man sicherstellt, dass eine HTML-ID einen Bindestrich im Namen hat, werden Konflikte wie der unten beschriebene vermieden:
message.js
message = function(containerObject){
this.htmlObject = containerObject;
};
message.prototype.write = function(text){
this.htmlObject.innerHTML+=text;
};html
<body>
<span id='message-text'></span>
</body>
<script>
var objectContainer = {};
if(typeof message == 'undefined'){
var asyncScript = document.createElement('script');
asyncScript.onload = function(){
objectContainer.messageClass = new message(document.getElementById('message-text'));
objectContainer.messageClass.write('loaded');
}
asyncScript.src = 'message.js';
document.appendChild(asyncScript);
}else{
objectContainer.messageClass = new message(document.getElementById('message-text'));
objectContainer.messageClass.write('loaded');
}
</script>Natürlich könnten Sie messageText oder message_text verwenden, aber das löst das Problem nicht, und Sie könnten später auf das gleiche Problem stoßen, wenn Sie versehentlich auf ein HTML-Objekt statt auf ein JavaScript-Objekt zugreifen würden
Eine Anmerkung: Sie können immer noch auf die HTML-Objekte über das (z. B.) window-Objekt zugreifen, indem Sie window['message-text'] verwenden;
Klas Mellbourn
Punkte
38752
Ich empfehle die Google HTML/CSS Style Guide
Trennen Sie Wörter in ID- und Klassennamen durch einen Bindestrich . Verketten Sie Wörter und Abkürzungen in Selektoren nicht mit anderen Zeichen als Bindestrichen (auch nicht mit gar keinen), um das Verständnis und die Lesbarkeit zu verbessern.
/* Not recommended: does not separate the words “demo” and “image” */
.demoimage {}
/* Not recommended: uses underscore instead of hyphen */
.error_status {}
/* Recommended */
#video-id {}
.ads-sample {}
Doug Neiner
Punkte
63907
Es kommt wirklich auf die Vorlieben an, aber der Editor, mit dem Sie programmieren, kann Sie in eine bestimmte Richtung lenken. Zum Beispiel ist die Autovervollständigungsfunktion von TextMate bleibt bei einem Bindestrich stehen, betrachtet aber durch einen Unterstrich getrennte Wörter als ein einziges Wort. Daher werden Klassennamen und IDs mit the_post besser funktionieren als the-post bei Verwendung der Autovervollständigungsfunktion ( Esc ).
adamse
Punkte
12587
Ich glaube, das liegt ganz im Ermessen des Programmierers. Sie könnten auch camelCase verwenden, wenn Sie wollen (aber ich denke, das würde unangenehm aussehen.)
Ich persönlich bevorzuge den Bindestrich, weil er auf meiner Tastatur schneller zu schreiben ist. Ich würde also sagen, dass Sie sich für das entscheiden sollten, was Ihnen am angenehmsten ist, da Ihre beiden Beispiele weit verbreitet sind.
- See previous answers
- Weitere Antworten anzeigen
