iframe
iframe的定义与用法
- iframe 元素会创建包含另外一个文档的内联框架（即行内框架）。
iframe的name属性可以与a标签、form标签的target属性值结合使用
示例
点击京东链接让京东的页面在name为jd的iframe中打开
<iframe name="jd" frameborder="0">iframe</iframe>
<a href="https://www.jd.com/" target="jd">京东</a>
a 标签
target
规定在何处打开链接文档。
-
_self：当前页面打开。没有指定属性值时此为默认值
-
_blank:新窗口打开
-
_parent`:父级页面打开
-
_top:顶层页面打开
-
xxx:在name为xxx的窗口打开
download
浏览器决定要不要下载是由http响应决定的。如果http响应的content-type是：
Content-Type: application/octet-stream
浏览器就会以下载的形式接收这个响应。
通常是在a标签上加上download属性。
加上downlaod属性后，可完成对href属性链接文件的下载，但仅仅是限于同源文件，如果是非同源，download属性会失效。
无download属性的时候，a标签的默认行为是链接跳转进行预览，而针对浏览无法预览的文件，也可达到下载的效果。
download还可指定下载的文件名
<a href="xxx.jpg" download="_x1_.jpg">下载</a>
后缀名一样还可以缺省：
<a href="xxx.jpg" download="_x1_">下载</a>
href
href规定链接指向的页面的 URL。
href是最重要的属性，如果 href 属性没有被指定链接，<a> 标签将不是一个链接。
<a href="">下载</a>
刷新页面并回到顶部
<a href="#">下载</a>
回到顶部不刷新页面。如果当前页面中需要滚动的话，那么用这种方式就可以直接回到顶部。
<a href="//qq.com">QQ</a>
无协议链接，表示和当前页面使用同一种协议打开，当浏览本地文件的时候，它会解析为 file:// 协议
href路径的几种情况
-
a标签的href属性值如果是以http开头的，那么浏览器会马上启动http解释器去解释该网址，首先会在本地机器去找一个hosts文件， 如果在hosts文件上该域名没有对应的主机，那么浏览器就去到对应的dns服务器去寻找该域名对应的主机号。如果找到了对应的主机，那么该请求就会发给对应的主机。
-
如果a标签的href属性值没有以任何协议开头，那么浏览就会启动file协议解释器去解释该资源路径。
-
如果a标签的href属性值并不是以http开始，而且其他的一些协议，那么这时候浏览器就回去到我们本地的注册表中去查找是否有处理这种协议的应用程序，如果有，那么马上启动该应用程序处理该协议。
<a href="#xxx">xxx</a>
锚点，跳转到当前页面中某标签的id为xxx的部分
<a href="javascript:;">xxx</a>
伪协议，点击a标签执行一段js代码，但是此方法会直接将js方法暴露在浏览器的状态栏，
适当的方法有如下几种：
<a href="javascript:void(0);" οnclick="js_method()">x</a>
<a href="javascript:;" οnclick="js_method()">x</a>
<a href="#" οnclick="js_method();return false;">x</a>
form标签
收集用户数据，并决定以何种方式提交给服务器
action：指定提交的路径
method：表单数据提交的方式，get/post，默认是get方式提交
name：定义表单名称
id： 唯一标识符
target:规定在何处打开action指定的路径
如果表单里没有提交按钮，就无法提交，即使按回车也无效（没有添加js的情况下）
如果表单里只有一个<button></button>那么button自动升级为submit按钮而 <input type="button" value="button">或者<button type="button"></button> 不会
input标签
type：根据不同的 type 属性值，使得输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等
name:控件的名字，不设置name 不会影响功能实现，但作为提交给后台的字段，没有name则无法提交(不加name，提交时input的值就不会出现在请求里)
value:提交给后台的值
id:唯一标识符
在写单选或多选时会在input前加上lable标签，使得点击input文字时能触发input控件
写法：input设置id属性 label设置for=id，从而使文字与控件关联
<label for="xxx">点我</label>
<input type="radio" name="test" id="xxx">
简化写法：用lablel嵌套input（直接省略 id 属性，取消for属性绑定）
<label>点我
<input type="radio">
</label>
网友评论