当人们想用“http://example.com/#foo“方法,应该使用
<h1><a name="foo"/>Foo Title</h1>
or
<h1 id="foo">Foo Title</h1>
它们都有效,但它们是相等的,还是有语义差异?
当人们想用“http://example.com/#foo“方法,应该使用
<h1><a name="foo"/>Foo Title</h1>
or
<h1 id="foo">Foo Title</h1>
它们都有效,但它们是相等的,还是有语义差异?
当前回答
您不应该在任何类型的HTML中使用<h1><a name=“foo”/>foo-Title</h1>作为text/HTML,因为text/HTML不支持XML空元素语法。然而,<h1><a name=“foo”>foo Title</a></h1>在HTML4中是可以的。它在当前起草的HTML5中无效。
<h1 id=“foo”>foo Title</h1>在HTML4和HTML5中都可以。这在Netscape 4中不起作用,但您可能会使用其他十几个在Netscape 4上不起作用的功能。
其他回答
旧浏览器使用name属性,新浏览器使用id属性怎么样。将使用这两个选项,默认情况下将实现回退方法!!!
维基百科大量使用这一功能,如下所示:
<a href="#History">[...]</a>
<span class="mw-headline" id="History">History</span>
维基百科对每个人都有效,所以我觉得坚持使用这个表单是安全的。
另外,不要忘记,您不仅可以将其用于span,还可以用于div甚至表单元格,然后您就可以访问元素上的:target伪类。只需注意不要改变宽度,如粗体文本,因为这会移动内容,这令人不安。
命名主播-我的投票是避免:
“名称和ID在同一个命名空间中……”-两个具有相同命名空间的属性简直太疯狂了。我们就说已经弃用了。“锚定没有href atribute的元素”-同样,元素的性质(超链接与否)是通过有atribute来定义的?!双重疯狂。常识说要完全避免。如果在没有伪类的情况下对锚点进行样式设置,则样式设置将应用于每个锚点。在CSS3中,您可以使用属性选择器(或每个伪类的相同样式)来解决这个问题,但这仍然是一个解决方法。这通常不会出现,因为您为每个伪类选择颜色,并且默认情况下,下划线只有删除才有意义,这使其与其他文本相同。但如果你决定将链接设置为粗体,这会带来麻烦。网景4可能不支持id功能,但一个未知的属性不会引起任何问题。这就是我所说的兼容性。
现在不是关于支持的问题,因为2021谁会关心比IE6更旧的浏览器?
请注意,Stacksoverflow仍在使用锚点和“name”属性,而不是“name”特性。
Why?
因为你:
SINGLE元素上的id不能有两个值。
#样品{颜色:红色;}<div id=“postNr4245 sample”>示例文本</div><!--着色不起作用--><a href=“#postNr4245”>跳转到帖子</a><!--跳跃不起作用-->
好吧,你可以说你可以用“class”来实现这一点。
这是真的,但如果只有一个元素需要在站点上设置样式,那么就不应该使用类。
Why?
因为如果您使用CSS选择器#idName,并且web浏览器找到了该元素,它就不会再看下去了。它加快了网站的加载速度。
如果您使用.class,它需要查找DOM的每个位置,因为web浏览器不知道您是否使用过.class一次或多次。
如果要在CSS中设置“id”值的样式或使用JS解析它,则不能以数字开头。但是,可以以数字开头“name”值。
第二个示例为所讨论的元素分配一个唯一的ID。然后可以使用DHTML操纵或访问该元素。
另一方面,第一个方法在文档中设置一个命名位置,类似于书签。连接到一个“锚”,这是完全合理的。
注意JavaScript用户:所有ID都成为窗口下的全局变量。
<h1 id="foo">Foo Title</h1>
刚刚创建了JS全局:
window.foo
window.foo的值将是h1的HTMLElement。
除非您能保证id属性中使用的所有值都是安全的,否则您可能更喜欢使用名称:
<h1 name="foo">Foo Title</h1>