1.HTML新元素

【output】定义计算结果。

 <output></output>

【canvas】定义使用 JavaScript 的图像绘制。

<canvas></canvas>

【audio】定义声音或音乐内容。

<audio src=""></audio>

【embed】定义外部应用程序的容器（比如插件）。

<embed src="" type="">

【source】定义<video>和 <audio> 的来源。

<source>

【video】定义视频或影片内容。

  <video src=""></video>
  

2.【form】表单

作用：用于收集用户输入。

【form】表单标签

<form action=""></form>

【完整的表单标签】

<form action="" name="" method="" enctype="" target=""autocomplete="" accept-charset=""novalidate></form>

【form】表单属性

action: 定义提交表单时要执行的操作。

向服务器提交表单的通常做法是使用提交按钮。

通常，表单会被提交到 web 服务器上的网页。

如果省略 action 属性，则 action 会被设置为当前页面。

处理程序属性（提交位置）可以是绝对地址，也可以是相对地址（可以是网页，也可以是E-main）

表单名称属性

name: 如果要正确地被提交，每个输入字段必须设置一个 name 属性。

method: 规定在提交表单时所用的 HTTP 方法（GET 或 POST）;

传送方法 一般只有GET 和 POST 两种方式 (后期会实现表单交互功能)

【参数值】

【GET】方法（默认方法）

如果表单提交是被动的（比如搜索引擎查询），并且没有敏感信息。

当您使用 GET 时，表单数据在页面地址栏中是可见的。

注意：GET 最适合少量数据的提交。浏览器会设定容量限制。

• 以名称/值对的形式将表单数据追加到 URL

• 永远不要使用 GET 发送敏感数据！（提交的表单数据在 URL 中可见！）

• URL 的长度受到限制（2048 个字符）

• 对于用户希望将结果添加为书签的表单提交很有用

• GET 适用于非安全数据，例如 Google 中的查询字符串

【POST】方法

如果表单正在更新数据，或者包含敏感信息（例如密码）。

POST 的安全性更加，因为在页面地址栏中被提交的数据是不可见的。

注意：如果表单数据包含敏感信息或个人信息，请务必使用 POST！

• 将表单数据附加在 HTTP 请求的正文中（不在 URL 中显示提交的表单数据）

• POST 没有大小限制，可用于发送大量数据。

• 带有 POST 的表单提交无法添加书签

enctype: 规定被提交数据的编码（默认：url-encoded）

编码方式 text/plain 以纯文本的方式传送 application/x-www-form-urlencoded 默认的编码格式 multipart/form-data MIME编码，上传文件的表单必须选择该项。

target: 规定提交表单后在何处显示响应。

目标显示方式属性

_blank返回的信息显示在新的窗口中

_parent返回的信息显示在父级的浏览器窗口中

_self返回的信息显示在当前浏览器窗口

_top返回的信息显示在顶级浏览器窗口中

【参数值】

• _blank ：应显示在新窗口或选项卡中。
• _self 响应显示在当前窗口中。(默认值)
• _parent 响应显示在父框架中。
• _top 响应显示在窗口的整个 body 中。
• framename 响应显示在命名的 iframe 中。

autocomplete：规定表单是否应打开自动完成功能。

启用自动完成功能后，浏览器会根据用户之前输入的值自动填写值。

novalidate：一个布尔属性。

如果已设置，它规定提交时不应验证表单数据。

accept-charset：用于表单提交的字符编码。

规定服务器用哪种字符集处理表单数据。

【参数值】

服务器可处理的一个或多个字符集。如需规定一个以上的字符集，请使用逗号来分隔各字符集。

常用值：

• UTF-8 - Unicode 字符编码
• ISO-8859-1 - 拉丁字母表的字符编码
• gb2312 - 简体中文字符集

理论上讲，可使用任何字符编码，但没有浏览器可以理解所有的编码。字符编码使用得越广泛，浏览器对其支持越好。

【form】表单元素

<form action=""></form>

【input】输入框元素

input 输入标签 name 控件名称 size控件长度 maxlength最大字符数 value默认取值

<input type="">

type: 据不同的 type 属性，可以变化为多种形态。

【datalist】元素

使用style="display: none;"将datalist设置为不显示

元素为<input>元素规定预定义选项列表。

用户会在他们输入数据时看到预定义选项的下拉列表。

<input>元素的list属性必须引用<datalist>元素的id 属性。

<form action="">
       <input list="属性名">
       <datalist id="属性名">
           <option value=""></option>
           <option value=""></option>
           <option value=""></option>
       </datalist>
   </form>

注：属性名要一致

【输入类型】

a.文本框 text (供文本输入的单行输入字段)

<input type="text">

b.密码域 password(定义密码字段)

<input type="password">

注：password 字段中的字符会被做掩码处理（显示为星号或实心圆）。

c.单选按钮 radio

<input type="radio">

d.复选框 checkbox

<input type="checkbox">

复选框允许用户在有限数量的选项中选择零个或多个选项。

e.普通按钮 button

<input type="button">

f.提交按钮 submit(定义提交表单数据至表单处理程序的按钮。)

<input type="submit">

表单处理程序（form-handler）通常是包含处理输入数据的脚本的服务器页面。

在表单的 action 属性中规定表单处理程序（form-handler）

注：省略了提交按钮的 value 属性，那么该按钮将获得默认文本

g.重置按钮 reset

<input type="reset">

h.图像域 image

<input type="image">

i.隐藏域 hidden

<input type="hidden">

隐藏域主要用来传递一些参数，这些参数并不会在页面中显示 user_id 隐藏域的名称 100001用户的id值

j.文件域 file

<input type="file">

3.HTML5表单中的input新属性(type)

i.email 类型:

<input type="email">

用于应该包含电子邮件地址的输入字段。

能够在被提交时自动对电子邮件地址进行验证。

某些智能手机会识别 email 类型，并在键盘增加 ".com" 以匹配电子邮件输入。

ii.url 输入类型:

<input type="url">

用于应该包含 URL 地址的输入字段。

在提交时能够自动验证 url 字段。

某些智能手机识别 url 类型，并向键盘添加 ".com" 以匹配 url 输入。

iii.date类型:

<input type="date">

用于应该包含日期的输入字段。

日期选择器会出现输入字段中。

iv.time 类型:

<input type="time">

允许用户选择时间（无时区）。

时间选择器会出现输入字段中。

v.datetime 类型:

<input type="datetime">

允许用户选择日期和时间（有时区）。 日期选择器会出现输入字段中。

vi.datetime-local 类型:

<input type="datetime-local">

允许用户选择日期和时间（无时区）。 日期选择器会出现输入字段中。

vii.month 类型:

<input type="month">

允许用户选择月份和年份。 日期选择器会出现输入字段中。

viii.week 类型:

<input type="week">

允许用户选择周和年。 日期选择器会出现输入字段中。

ix.number 类型:（用于应该包含数字值的输入字段。）

<input type="number">

能够对数字做出限制。 根据浏览器支持，限制可应用到输入字段。

x.range类型:

<input type="range">

包含一定范围内的值的输入字段。 输入字段能够显示为滑块控件。

xi.search 类型:

<input type="search">

用于搜索字段（搜索字段的表现类似常规文本字段）。

xii.tel 类型:

<input type="tel">

用于应该包含电话号码的输入字段。

xiii. color类型 :

<input type="color">

包含颜色的输入字段。 颜色选择器会出现输入字段中。

【input属性】

【value】规定输入字段的初始值：

【readonly】规定输入字段为只读（不能修改）

readonly 属性不需要值。它等同于 readonly="readonly"。

【disabled】规定输入字段是禁用的。

被禁用的元素是不可用和不可点击的。

被禁用的元素不会被提交。

disabled 属性不需要值。它等同于 disabled="disabled"。

【size】规定输入字段的尺寸（以字符计）

【maxlength】规定输入字段允许的最大长度。

设置 maxlength 属性，则输入控件不会接受超过所允许数的字符。

该属性不会提供任何反馈。如果需要提醒用户，则必须编写 JavaScript 代码。

注：输入限制并非万无一失。JavaScript 提供了很多方法来增加非法输入。如需安全地限制输入，则接受者（服务器）必须同时对限制进行检查。

4.HTML5表单中的input新属性

【autocomplete】规定表单或输入字段是否应该自动完成。

判断是否保存输入值 on是 off否 ""不指定 当自动完成开启，浏览器会基于用户之前的输入值自动填写值。

提示：可以把表单的 autocomplete 设置为 on，同时把特定的输入字段设置为 off，反之亦然。

autocomplete 属性适用于 <form> 以及如下 <input> 类型：text、search、url、tel、email、password、datepickers、range 以及 color。

提示：在某些浏览器中，也许需要手动启用自动完成功能。

【novalidate】在提交表单时不对表单数据进行验证。

【autofocus】布尔属性。规定当页面加载时 <input> 元素应该自动获得焦点。

【form】规定<input>元素所属的一个或多个表单。

提示：如需引用一个以上的表单，请使用空格分隔的表单 id 列表。 input 的 form 属性规定 元素所属的表单。

此属性的值必须等于它所属的 <form>元素的 id 属性。

【formaction】规定当提交表单时处理该输入控件的文件的 URL。

提示：formaction 属性覆盖<form>元素的 action 属性。

formaction 属性适用于 type="submit" 以及 type="image"。

【formenctype】规定定当把表单数据（form-data）提交至服务器时如何对其进行编码（仅针对 method="post"的表单）。

提示：formenctype 属性覆盖 <form> 元素的 enctype 属性。

formenctype 属性适用于 type="submit" 以及 type="image"。

【formmethod】定义用以向 action URL 发送表单数据（form-data）的 HTTP 方法。

提示：formmethod 属性覆盖 <form> 元素的 method 属性。

formmethod 属性适用于 type="submit" 以及 type="image"。

表单数据可以作为 URL变量（method="get"）或作为 HTTP post 事务（method="post"）发送。

关于 GET 的注意事项：

• 以名称/值对的形式将表单数据追加到 URL
• 永远不要使用 GET 发送敏感数据！（提交的表单数据在 URL 中可见！）
• URL 的长度受到限制（2048 个字符）
• 对于用户希望将结果添加为书签的表单提交很有用
• GET 适用于非安全数据，例如 Google 中的查询字符串

关于 POST 的注意事项：

• 将表单数据附加在 HTTP 请求的正文中（不在 URL 中显示提交的表单数据）
• POST没有大小限制，可用于发送大量数据。
• 带有 POST 的表单提交无法添加书签

提示：如果表单数据包含敏感信息或个人信息，请务必使用 POST！

【formnovalidate】布尔属性。规定在提交表单时不对 <input> 元素进行验证。

*提示：formnovalidate 属性**覆盖 *<form> 元素的 novalidate 属性。 formnovalidate 属性可用于 type="submit"。

【formtarget 】规定的名称或关键词指示提交表单后在何处显示接收到的响应。

*提示：formtarget 属性会**覆盖 *<form> 元素的 target 属性。

formtarget 属性可与 type="submit" 和 type="image" 使用。

【width】宽度和【height】高度

【list】引用的 <datalist> 元素中包含了 <input> 元素的预定义选项。

【max】最大值 和【min】最小值

min 和 max 属性适用于如需输入类型：number、range、date、datetime、datetime-local、month、time 以及week。

【multiple】布尔属性。规定允许用户在 <input> 元素中输入一个以上的值。

multiple 属性适用于以下输入类型：email 和 file。

【pattern】规定用于检查 <input> 元素值的正则表达式。

pattern 属性适用于以下输入类型：text、search、url、tel、email、and password。

提示：请使用全局的 title 属性对模式进行描述以帮助用户。

【placeholder】规定用以描述输入字段预期值的提示（样本值或有关格式的简短描述）。

placeholder 提示信息

该提示会在用户输入值之前显示在输入字段中。

placeholder 属性适用于以下输入类型：text、search、url、tel、email以及 password。

【required 】布尔属性。规定在提交表单之前必须填写输入字段。

required 属性适用于以下输入类型：text、search、url、tel、email、password、date pickers、number、checkbox、radio、and file.

【step】规定 <input> 元素的合法数字间隔。

能够制定输入值递增或者递减的梯度

注:stepUp函数和stepDwon函数

示例：如果 step="3"，则合法数字应该是 -3、0、3、6、等等。

提示：step 属性可与 max 以及 min 属性一同使用，来创建合法值的范围。

step 属性适用于以下输入类型：number、range、date、datetime、datetime-local、month、time 以及 week。

【select】下拉列表元素

size 定义列表长度 multiple多行显示 selected默认选项

<select name="" id="" size=””multiple>
            <option value=""selected></option>
            <option value="" ></option>
</select>

option: 定义待选择的选项。

列表通常会把首个选项显示为被选选项。

您能够通过添加 selected 属性来定义预定义选项。

【textarea】文本框元素

cols 文本域的行数 rows文本域的列表

<textarea name="" id="" cols="30" rows="10"></textarea>

元素定义多行输入字段（文本域）

【button】按钮元素

<button></button>

元素定义可点击的按钮