美文网首页
a标签梳理

a标签梳理

作者: 李悦之 | 来源:发表于2017-05-19 10:11 被阅读13次
    1、a标签的href
    <a href='./xxx/index.html'>百度</a>
    <a href='../xxx/index.html'>百度</a>
    

    这两个都是相对路径,第一个是从当前目录下找xxx里的index.html文件;第二个是从当前目录的父目录的xxx里找index.html。如果当前目录就是根目录,就不能再往上去了。

    <a href='/xxx/index.html'>百度</a>
    <a href='/yyy/index.html'>百度</a>
    

    这两个都是绝对路径,当点击了以后,这两个路径都会添加到根目录下,绝对路径是和根目录来说的。

    <a href='http://www.baidu.com'>百度</a>
    

    这也是绝对路径,带有协议。

    <a href='//baidu.com'>百度</a>
    

    这是无协议路径,意思就是使用当前协议

    <a href='javascript:;'>点我</a>
    <a href='javascript:void 0;'>点我</a>
    

    在a标签中,如果href什么都不写,它依然会跳转到当前页面,但是如果用一个javascript伪协议就不跳了。

    <a href='#xxx'>百度</a>
    

    这里的锚点就可以自动跳转到页面上相应id为xxx的地方,如果页面下面地方不够,需要用东西把页面撑起来才看放到开头。这也是锚点的一个问题。

    2、a标签的target
    • _self 默认,在当前窗口打开
    • _blank 在新窗口打开
    • _parent 在父窗口打开
    • _top 在祖先窗口打开
    <a href='//baidu.com' target='xxx'>百度</a>
    <a href='//qq.com' target='xxx'>QQ</a>
    

    当把一个名字给target的时就会复用这个窗口,因为这个时候window.name就是xxx。当第一个a标签点开,再点第二个的时候依然会在上一个窗口打开页面。

    3、a标签的download
    <a href="//baidu.com" target="xxx" download>click me</a>
    

    点击就会直接下载百度的首页

    相关文章

      网友评论

          本文标题:a标签梳理

          本文链接:https://www.haomeiwen.com/subject/xcgexxtx.html