为HTML元素创建id属性时,该值有哪些规则?
当前回答
大写和小写字母有效“_”和“-”也有效数字有效冒号(,)和句点(.)似乎有效有趣的是,表情符号起作用
其他回答
救命,我的Javascript坏了!
每个人都说ID不能重复。
在除FireFox之外的所有浏览器中都试用过
<div id=“ONE”></div><div id=“ONE”></div><div id=“ONE”></div><脚本>document.body.append(document.querySelectorAll(“#ONE”).length,'DIV!')document.body.append('in',typeofONE)console.log(一);//全局变量!!</script>
解释
在世纪之交,微软拥有90%的浏览器市场份额,
并实施从未标准化的浏览器行为:
1.为每个ID创建全局变量
2.为重复ID创建数组
所有后来的浏览器供应商都复制了这种行为,否则他们的浏览器将不支持旧网站。
2015年左右,Mozilla删除了2。来自FireFox和1。仍然有效。
所有其他浏览器仍然支持1。和2。
我每天都使用它,因为键入ONE而不是document.querySelector(“#ONE”)帮助我更快地创建原型;我不在生产中使用它。
严格来说,它应该匹配
[A-Za-z][-A-Za-z0-9_:.]*
但是jQuery似乎有冒号的问题,所以最好避免使用冒号。
实际上,许多网站使用以数字开头的id属性,尽管这在技术上是无效的HTML。
HTML5草案规范放宽了id和name属性的规则:它们现在只是不透明的字符串,不能包含空格。
字母表→ 大写和小写
数字→ 0-9
特殊字符→ ':', '-', '_', '.'
格式应以“.”开头或字母表,后跟更多字母或数字的特殊字符。id字段的值不能以“_”结尾。
此外,不允许空格,如果提供了空格,它们将被视为不同的值,这在id属性的情况下是无效的。
对于HTML 4,技术上的答案是:
ID和NAME标记必须以字母([a-Za-z])开头,后面可以是任意数量的字母、数字([0-9])、连字符(“-”)、下划线(“_”)、冒号(“:”)和句点(“.”)。
HTML5甚至更为宽松,只表示id必须至少包含一个字符,并且不能包含任何空格字符。
在XHTML中,id属性区分大小写。
作为一个纯粹的实际问题,您可能需要避免某些字符。句点、冒号和“#”在CSS选择器中具有特殊含义,因此您必须在CSS中使用反斜杠或在传递给jQuery的选择器字符串中使用双反斜杠来转义这些字符。想想在你疯狂地使用id中的句点和冒号之前,你需要多长时间在样式表或代码中转义一个字符。
例如,HTML声明<div id=“first.name”></div>是有效的。您可以在CSS中将该元素选择为#first\.name,并在jQuery中选择为:$('#first\\name')。但是如果您忘记了反斜杠$('#first.name'),您将拥有一个完全有效的选择器来查找一个id优先且具有类名的元素。这是一个容易忽视的错误。从长远来看,选择id名(连字符而不是句点)可能会更快乐。
通过严格遵守命名约定,可以简化开发任务。例如,如果您将自己完全限制为小写字符,并且始终使用连字符或下划线分隔单词(但不能同时使用连字符和下划线,请选择其中一个,不要使用另一个),那么您就有了一个易于记忆的模式。你永远不会怀疑“是firstName还是firstName?”,因为你永远知道你应该输入first_name。更喜欢驼色?然后限制自己,不要使用连字符或下划线,并且始终对第一个字符使用大写或小写,不要混用它们。
现在一个非常模糊的问题是,至少有一个浏览器Netscape 6错误地将id属性值视为区分大小写。这意味着,如果您在HTML中键入id=“firstName”(小写'f'),在CSS中键入#firstName{color:red}(大写'f'),则错误浏览器将无法将元素的颜色设置为红色。在2015年4月进行编辑时,我希望您没有被要求支持Netscape 6。将其视为历史脚注。
推荐文章
- 使伸缩项目正确浮动
- 形式内联内的形式水平在twitter bootstrap?
- 自定义元素在HTML5中有效吗?
- 如何触发自动填充在谷歌Chrome?
- 创建圈div比使用图像更容易的方法?
- 为什么Chrome浏览器不正确地确定页面是在不同的语言,并提供翻译?
- 在网页上用鼠标模拟震颤(例如帕金森病)?
- Bootstrap抛出Uncaught错误:Bootstrap的JavaScript需要jQuery
- 如何改变文本区域的边框颜色:焦点
- 我如何设置背景颜色为文本的宽度,而不是整个元素的宽度,使用CSS?
- 如何删除和清除所有的本地存储数据
- 强制打开“另存为…”弹出打开文本链接点击PDF在HTML
- 如何修改标签文本?
- 在HTML中还有其他有用的空格码吗,比如半空格的 , em-spaces, en-spaces等等?
- 输入触发器按钮单击