HTML 标签小细节
简书地址:https://www.jianshu.com/p/03a23aa28a34
今天重新学习了一下HTML中标签的用法,补充并记录一下自己新学到的知识。
a中的href
href
Contains a URL or a URL fragment that the hyperlink points to.
URLs are not restricted to Web (HTTP)-based documents, but can use any protocol supported by the browser. For example,file:
,ftp:
, andmailto:
work in most browsers.
href属性的值是URL,虽然我们一般用URL做基于http协议的网页的跳转,但它的写法上还有一些小细节。
<a href="http://www.qq.com">QQ1</a>
<a href="www.qq.com">QQ2</a>
<a href="//www.qq.com">QQ3</a>
上面是一个指向www.qq.com的a标签的三种写法,那么它们的效果有什么不一样呢?
一
第一条是最常规的方法,基于http协议,点击即可进入http://www.qq.com的页面。
二
第二条点击进去却不行了,显示文件不存在?
观察一下它打开的url发现是
也就是说浏览器把www.qq.com当成了当前目录下的文件打开了,而我的电脑上当前目录并不存在www.qq.com的文件,所以才会显示文件不存在。
三
打开第三个链接时出现了这个file文件的界面
观察一下打开的url
这是因为当href的url以//开头时,将使用当前页面的协议打开文件(因为根目录/不存在www.qq.com所以还是显示根目录的file文件)
当打开http-server后再试一下第三个链接
成功通过http://127.0.0.1:8083的http协议打开了//qq.com
再试一下第二个链接...
四
href还可以给url构造参数查询。
<a href="?name=hello">hello</a>
点击后会跳转到当前url后多了一个?name=hello
的url并且生成了一个get请求
五
href还可以应用于JavaScript伪协议javascript:
<a href="javasript:;">Click</a>
作用是生成一个什么事情也不做也没有请求产生的链接。(大雾
之所以不用href="#"
是因为虽然它不会产生请求,但是会使页面跳动。不用href=""
是因为他会生成get请求刷新页面。
##form标签 > The HTML