html锚点定位可以使用A标签的name属性，也可以使用A标签的id属性(如果遇到jsp页面传参数，并且还要定位锚点怎么办？)

最新推荐文章于 2024-06-16 10:29:36 发布

程宇寒

最新推荐文章于 2024-06-16 10:29:36 发布

阅读量1.9k

点赞数

文章标签： html 锚点命名锚记前端开发 jsp

本文链接：https://blog.csdn.net/czh500/article/details/107118940

版权

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>锚点案例(锚点又叫命名锚记)</title>
<link rel="stylesheet" type="text/css" href="inputAndDiv.css">
</head>
<body style="background-color: #CCE8CF;">
<h1>锚点案例(锚点又叫命名锚记)</h1>
<a href="#foot">去foot</a><br /><br />
想要定位到锚点，可以使用A标签的name属性，也可以使用A标签的id属性<br /><br />
<a href="#linghuchong">通过id属性,定位到令狐冲位置</a><br /><br />
<a href="#linghuchong2">通过name属性,定位到令狐冲位置</a><br /><br />
<a id="top">top</a><br /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<a id="linghuchong" name="linghuchong2">令狐冲</a><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<a name="foot">foot</a><br /><br />
<a href="#top">去top</a>
</body>
</html>

如果你想要定位到其他页面的锚点的话，可以写成<a href="url#a元素的id属性值">定位到其他页面的锚点</a>

具体写法：<a href="p2.html#linghuchong">定位到p2.html页面的锚点</a>

注意：在web开发中，比如jsp页面，我们可能会在jsp页面中传参数，比如：list.jsp?name=jack&age=12&salary=267

如果遇到jsp页面传参数，并且还要定位锚点怎么办？比如：list.jsp?name=jack&age=12&salary=267#linghuchong这种写法可行吗？会不会有冲突呢？大家可以去测试一下！

比如：

list.jsp?name=jack&age=12&salary=267#linghuchong

和

list.jsp#linghuchong?name=jack&age=12&salary=267

这两种写法都可以去测试一下，看一下有什么问题？

程宇寒

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
html锚点定位可以使用A标签的name属性，也可以使用A标签的id属性(如果遇到jsp页面传参数，并且还要定位锚点怎么办？)

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>锚点案例(锚点又叫命名锚记)</title><link rel="stylesheet" type="text/css" href="inputAndDiv.css"></head><body style="background-color: #CCE8CF;">&...
复制链接

扫一扫