a标签
属性
-
href 链接到外部网页,内部锚点,邮箱等 取值
- google.com
- google.com
- //google.com
- 路径 /a/b/c以及a/b/c 此处/不是根目录,是启动web服务的目录
- 路径 index.html以及./index.html
- javascript:代码; 分号不能少
- mailto:邮箱
- tel:手机号
- #xxx: id为xxx的元素
href留空点击的话页面会刷新页面,可通过
<a href="javascript:;">Click</a>解决 -
target 新窗口打开or本窗口打开 取值
- _blank 新窗口打开
- _self 当前窗口打开
- _parent 在当前窗口的父级窗口打开,如b页面以iframe形式嵌入a页面,a和b页面中的a标签指向的地方都会在a页面中打开
- _top 在顶层窗口打开,如c页面以iframe形式嵌入b页面,a,b和c页面中的a标签指向的地方都会在a页面中打开
- window的name e.g.
target=”xxx“没有窗口是xxx就打开一个新窗口并认其为xxx,后续target为xxx的页面都会在这个窗口中打开 可在控制台中通过window.name获取 - iframe的name e.g.
<iframe src="" name="xxx"></iframe>,可通过target=”xxx“在这个iframe中打开页面
-
download 下载网页,很多浏览器不支持
-
rel=noopener 防止一个bug
table标签
一个基础的表格
<table>
<thead>
<tr>
<!-- table row -->
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
</tr>
</tbody>
<tfoot>
<!-- 一般作汇总列 -->
<tr>
<td></td>
</tr>
</tfoot>
</table>
如果想要左侧也是表头,那么可以在tbody的tr中使用th
img标签
发出get请求,返回一张图片
属性
- alt 加载失败时出现的文字
- height/width 设置图片宽和高
- src 图片路径,可以是文件地址也可以是图片路由
form标签
发get或者post请求,然后更新页面
属性
- action 控制请求的页面
- method 控制用GET或POST方法
- autocomplete 是否给出自动填充提示 值为on/off
- target 把哪个页面变为action中请求的页面
事件
onsubmit 当type为submit的按钮提交时触发的事件,button标签不指定type时默认type为submit
input标签
让用户输入内容
属性
类型
- text 文本
- password 密码
- color 颜色选择
- radio 单选框 name相同的radio为一组,组内可单选
- checkbox 多选 name相同的为一组
- file 选择文件 可以添加multiple属性以选择多个文件
- hidden 隐藏的,一般用于让机器输入
- submit 提交按钮 input按钮和button按钮的区别:button按钮中可以含有其他标签如strong,img并正常显示效果,而input不行
事件
- onchange 改变时触发的事件
- onfocus 鼠标悬浮时触发
- onblur 鼠标从里面移出时触发
验证器
HTML5新增
e.g. 添加required属性,如果带此属性的input为空,提交时会提示你填写并不予提交
注意事项
- 一般不监听input的click事件
- form里的input要有name(一般input放在form里)
- form里要放type=submit才能触发submit事件
