前端:a标签的跳转方式
25号底片~ 2024-06-15 13:03:05 阅读 61
一、内部页面跳转:使用相对路径或者绝对路径指定目标页面的URL,例如:
<a href="page.html">跳转到page页面</a>
二、外部页面跳转:使用完整的URL指定目标页面的地址,例如:
<a href="https://example.com">跳转到example.com页面</a>
三、跳转到锚点:通过指定目标页面中的锚点来进行跳转,例如:
<a href="#section2">跳转到页面中的section2</a>
目标页面中需要包含对应的锚点,例如:
<h2 id="section2">这是第二个部分</h2>
四、在新窗口打开页面:使用target="_blank"
属性可以在新的浏览器窗口或标签页中打开目标页面,例如:
<a href="page.html" target="_blank">在新窗口打开page页面</a>
target属性
1、在当前窗口中打开链接(默认行为):
<a href="https://www.example.com">在当前窗口打开链接</a>
2、在新窗口中打开链接:
<a href="https://www.example.com" target="_blank">在新窗口打开链接</a>
3、在相同的框架中打开链接(如果有框架):
<a href="https://www.example.com" target="_self">在相同框架中打开链接</a>
4、在父框架中打开链接(如果有框架):
<a href="https://www.example.com" target="_parent">在父框架中打开链接</a>
5、在顶层窗口中打开链接:
<a href="https://www.example.com" target="_top">在顶层窗口中打开链接</a>
五、JavaScript跳转:使用JavaScript的window.location
属性进行跳转,例如:
<a href="javascript:window.location='page.html'">使用JavaScript跳转到page页面</a>
上一篇: electron+VUE Browserwindow与webview通信
下一篇: DataV - 免费开源的 Vue / React 大屏数据展示组件库,使用简单、效果酷炫的前端数据可视化开发插件
本文标签
声明
本文内容仅代表作者观点,或转载于其他网站,本站不以此文作为商业用途
如有涉及侵权,请联系本站进行删除
转载本站原创文章,请注明来源及作者。