html元素之超链接a
前言
这一章节详细阐述html元素a的使用。
属性
1、href
<a href="https:www.baidu.com/">点击</a>
href属性表示点击元素之后跳转的地址。如果没有href属性,则没有点击效果,而仅仅只是将该标签的内容部分作为普通文本显示。
关于html中地址的多种情况,请参考:
2、target
<a href="https:www.baidu.com/" target="_blank">点击</a>
taget属性指示跳转的地点。
- _blank:浏览器新标签页打开
- _parent:在父窗口中打开链接。
- _self:默认,当前页面跳转。
- _top:在当前窗体打开链接,并替换当前的整个窗体(框架页)。
- framename:
3、download
<a href="" download="/images/logo.png">下载</a>
download属性用于下载,指示下载资源的路径。需要注意,此时href需要设置,可以是空字符串或任意值,并不会发起跳转,但是如果没有href属性,将不具备点击功能。
事件
一般,超链接不会也没有必要引入事件。
(1)onclick
<a href="https://www.baidu.com/" download="abx.js" onclick="alert(123)">下载</a>
事件、href和download三者具备,如果href为绝对路径时,在事件完成后跳转到href的地址。
如果href为根路径或者相对路径,在事件完成后下载download资源
仅有href和事件,则在事件完成后跳转到href的地址
如果href为javascript伪协议,先执行事件,再执行href,不执行download
(2)onmouseover
鼠标移动到元素区域即会触发该事件
标签的内容
一般为文本,可以引入图片,按钮等其他元素
<a href="https://www.baidu.com/">百度</a>
<a href="https://www.baidu.com/"><button>点击</button></a>
<a href="https://www.baidu.com/"><div>点击</div></a>
<a href="https://www.baidu.com/"><img src="https://www.baidu.com/img/flexible/logo/pc/result.png"></a>
请求报文
<a href="https://www.baidu.com/">百度</a>
在burp的默认浏览器中,点击之后,进行跳转,请求报文如下。(Edge报文类似)
GET / HTTP/1.1
Host: www.baidu.com
Cookie: BIDUPSID=03120A3BAD31F5746579E59F47A8B79C; PSTM=1651037842; BAIDUID=03120A3BAD31F574E5DB61C01E12B770:FG=1; BD_UPN=12314753; BA_HECTOR=a88h2l2g85a52ga5vb1h6hlkk0q; kleck=3537f4af08d404becd78a231fcdeb9e9; BDORZ=B490B5EBF6F3CD402E515D22BCDA1598; baikeVisitId=fa1953ab-f45b-4937-a0f5-fecc92ac017d
Sec-Ch-Ua: "(Not(A:Brand";v="8", "Chromium";v="100"
Sec-Ch-Ua-Mobile: ?0
Sec-Ch-Ua-Platform: "Windows"
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/100.0.4896.127 Safari/537.36
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9
Sec-Fetch-Site: cross-site
Sec-Fetch-Mode: navigate
Sec-Fetch-User: ?1
Sec-Fetch-Dest: document
Referer: http://127.0.0.1:8843/
Accept-Encoding: gzip, deflate
Accept-Language: zh-CN,zh;q=0.9
Connection: close
分析:
(1)有referer字段
(2)携带了目标域的cookie
(3)没有content-type字段
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 25岁的心里话
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 按钮权限的设计及实现