a标签(HTTP POST请求)
1、target属性定义目标地址打开方式
在新窗口中打开:
<a href=“目标地址” target=“_blank”>链接显示的文本</a>
在自己本身位置打开:
<a href=“目标地址” target=“self”>链接显示的文本</a>
在上一级(爸爸位置)打开:
<a href=“目标地址” target=“parent”>链接显示的文本</a>
在顶级(最上级处)打开:
<a href=“目标地址” target=“top”>链接显示的文本</a>
2、a标签的download属性
直接点击链接即可下载:<a href=“目标地址” download>链接显示的文本</a>
3、a标签中href里的内容
<a href="//qq.com">QQ</a>
(href支持无协议:当前用的是http协议就自动继承http协议,用的是file就会用file协议。)
<a href="#xxx">QQ</a>
(页面不跳转,只是在当前页面刷新)
<a href="?name=xxx">QQ</a>
(点击之后会在当前页面发起?name=xxx的请求)
<a href="javascript:alert(hi);">Sayhi</a>
(点击之后弹出hi的对话框)
<a href="javascript:;">链接显示的文本</a>
(可以实现点击之后什么也不做的a标签)
form标签(HTTP GET请求)
<form action="users" target="同a标签用法一致" method="POST">
<input type="submit" value="提交">
</form>
*注:如果form标签里没有input元素就无法提交这个表格,除非用JS。
其中POST会默认把参数放在第四部分。
input标签
input中的type属性
1、button 若单独使用button并且未设置type,它会自动升级成提交按钮:<button>按钮</button>。
若使用在<input type="button" value=" ">它就只是一个按钮,并无提交功能。
2、submit 唯一能确定这个form表单能否点击提交。
3、checkbox 若想点击旁边提示文字也可以输入 eg:<input type="checkbox" id="xxx">
<label for="xxx">你喜欢前端工作吗</label>
*注:input的id需要和label的for内容成对出现。
简化写法也可达到上面的要求:<label>用户名<input type="text" name="xxx"></label>即用label标签将input包在里面。
4、radio单选框(一个选择下的几个选项必须赋予同一个name值,此时同一个name下只能勾选一个)
5、select下拉选项
<label>
<input type="radio" name="loveya" value="yes">Yes
</label>
<label>
<input type="radio" name="loveya" value="no">No
</label>
<label>
<input type="radio" name="loveya" value="dontknow">Don't know
</label>
eg:
<select name="hobby" multiple="multiple">
<option value="shoppinng" daisbled>shopping</option>
<option value="cooking" selected>cooking</option>
<option value="reading">reading</option>
</select>
<!--mulitiple设置选项是否可以多选,disabled为不可选,selected为默认选项-->
iframe标签
1、用frameborder来消除iframe标签自带的很丑的边框:<iframe src=" " frameborder="0"></iframe>
2、iframe的name属性必须和a标签的target属性结合来用,不然没什么意义。
<iframe name="xxx" src=" " frameborder="0"></iframe>
<a href=" " target="xxx"></a>