<div id="example-value">还是<div id="example_value">？
本网站和Twitter使用第一种样式。Facebook和Vimeo-第二个。
您使用哪一个？为什么？
Answers:
使用连字符可确保HTML和JavaScript之间的隔离。
为什么？见下文。
连字符可在CSS和HTML中使用，但不适用于JavaScript对象。
许多浏览器在大型项目中将HTML Ids注册为窗口/文档对象上的全局对象，这可能会带来很大的麻烦。
出于这个原因，我通过连字符使用名称，因此HTML id永远不会与JavaScript冲突。
考虑以下：
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>如果浏览器将HTML ID注册为全局对象，则上述操作将失败，因为消息不是“未定义”的，并且它将尝试创建HTML对象的实例。通过确保HTML ID名称中带有连字符，可以防止发生以下冲突：
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>当然，您可以使用messageText或message_text，但这不能解决问题，以后可能会遇到相同的问题，即您意外访问HTML对象而不是JavaScript对象。
一句话，您仍然可以使用window ['message-text'];通过（例如）window对象访问HTML对象；
window['message-text'];
它特别指出：
ID和类名称中的单词用连字符分隔。不要使用连字符以外的任何字符（包括所有字符）将选择器中的单词和缩写串联起来，以提高理解和可扫描性。
/* 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 {}BEM符号？
它的确取决于偏好，但是会在特定方向上影响您的是编辑器。例如，TextMate的自动完成功能在连字符处停止，但将由下划线分隔的单词视为单个单词。因此，与使用其自动完成功能（）the_post相比the-post，类名和ID的工作效果更好Esc。
我相信这完全取决于程序员。如果需要，您也可以使用camelCase（但我认为这看起来很尴尬。）
我个人更喜欢连字符，因为它可以更快地在键盘上键入。因此，我要说的是，您应该选择最适合自己的方式，因为这两个示例都被广泛使用。
实际上，某些外部框架（javascript，php）在ID名称中使用连字符有困难（错误？）。我使用下划线（960grid也是如此），并且一切都很好。
我建议使用下划线，主要是因为我遇到了JavaScript副作用。
如果要在位置栏中输入以下代码，则会出现错误：'example-value'未定义。如果div用下划线命名，那么它将起作用。
javascript:alert(example-value.currentStyle.hasLayout);document.getElementById("example-value")，它将正常工作。