【前端基础笔记】——关于HTML标签小知识（二）

http-server 是一个简单的零配置命令行HTTP服务器, 基于 nodeJs.

安装-$ npm install http-server -g

开启 http-server服务，终端进入目标文件夹，然后在终端输入：$ http-server -c-1   （！只输入http-server的话，更新了代码后，页面不会同步更新）

Starting up http-server, serving ./

Available on:

  http://127.0.0.1:8080

  http://192.168.8.196:8080

按CTRL-C关闭服务。

<iframe>

iframe name="xxx"配合<a target="xxx" >

frameborder="0"

target="_blank" 新开页面跳转

target="_self" 本页面跳转

target="_parten" 上一级页面跳转

targen="_top" 最上层页面跳转

<a> (get 跳转)

<a href="   " download>下载</a> 

<a href="">link</a>当前页面刷新

<a href="#">link</a>页面锚点变成#，然后页面滚动到顶部

 <a href="?name=123">link</a>发起一个get请求

<a href="./xxx.html"> link</a>当前目录下的xxx.html跳转

<a href="//xx.com">  无协议链接

 浏览器会根据当前协议，补全无协议链接的协议。

 如果用 file:// 协议浏览页面，就会访问到 file://qq.com，这是一个不存在的路径。

 应该尽量不使用 file:// 协议预览网页，以免无协议链接出错。

 

<a href="javascript:alert(1)"> link</a>执行JS 程序

<a href="javascript:;"> link</a>不跳转什么也不动的a标签

为什么要有 javascript 伪协议？

1.用户可在点击 a 时执行一段 javascript 代码。

2.在地址栏输入 javascript:alert(1) 可以在当前页面执行代码。

3.伪协议可以实现「点击之后没有任何动作的 a 标签」，满足特殊需求。

<form> (post跳转)

< form action= "users" method= "POST" >

< input type= "submit" value= "提交" >

< input type= "text" name= "username" >

< input type= "password" name= "password" >

</ form >

如果<form> 标签里面的 input 不加 name，那么在表单提交时，input 的值就不会出现在请求里。

表单没有提交按钮就无法提交form元素，除非使用JS。

<button>标签会在没有submit属性的情况下自动升级成submit属性按钮。

<input>标签需要设置submit属性之后才能有提交功能。

<laber>标签可以与input标签关联，具体实现代码有两种方法，如下

标准版：【for属性必须和id属性相同】

< label for= "username" >用户名 </ label >< input type= "text" name= "username" id= "username" >

简洁实用版：【label标签将input标签包住】

< label >用户名 < input type= "text" name= "username" ></ label >

<input> radio属性：实现单选框功能，需要设置统一的name属性来实现单选；CheckBox属性：实现多选框功能，通过value确定送往服务器的选项值。 

<select> 下拉选择列表。multiple属性：可多选；required：列表必填；size：显示选项的数量。

<option>标签定义下拉列表中的一个选项，必须配合<select>元素使用。disabled属性：禁用改选项；selected属性：默认该选项；value属性：定义送往服务器的选项值。

<textarea>标签，实现多行的文本输入的控件。cols属性设置可见宽度；rows属性设置可见行数，但两者都不够精确，最好还是用CSS像素设置。

<table>元素中表格单元格边框间隙可以使用CSS中的table{border-collapse:collapse}合并。