&article&标签定义外部的内容。比如来自一个外部的新闻提供者的一篇新的文章，或者来自 blog 的文本，或者是来自论坛的文本。亦或是来自其他外部源内容。
HTML5:&article&&/article&
HTML4:&div&&/div&
&aside&标签定义 article 以外的内容。aside 的内容应该与 article 的内容相关。
HTML5:&aside&Aside 的内容是独立的内容，但应与文档内容相关。&/aside&
HTML4:&div&Aside 的内容是独立的内容，但应与文档内容相关。&/div&
&audio& 标签定义声音，比如音乐或其他音频流。
HTML5:&audio src="someaudio.wav"&您的浏览器不支持 audio 标签。&/audio&
HTML4:&object type="application/ogg" data="someaudio.wav"&&param name="src" value="someaudio.wav"&&/object&
&canvas& 标签定义图形，比如图表和其他图像。这个 HTML 元素是为了客户端矢量图形而设计的。它自己没有行为，但却把一个绘图 API 展现给客户端 JavaScript 以使脚本能够把想绘制的东西都绘制到一块画布上。
HTML5:&canvas id="myCanvas" width="200" height="200"&&/canvas&
HTML4:&object data="inc/hdr.svg" type="image/svg+xml" width="200" height="200"&&/object&
&command& 标签定义命令按钮，比如单选按钮、复选框或按钮。
HTML5: &command onclick=cut()" label="cut"&
HTML4: none
&datalist& 标签定义可选数据的列表。与 input 元素配合使用，就可以制作出输入值的下拉列表。
HTML5: &datalist&&/datalist&
HTML4: see combobox.
&details& 标签定义元素的细节，用户可进行查看，或通过点击进行隐藏。与 &legend& 一起使用，来制作 detail 的标题。该标题对用户是可见的，当在其上点击时可打开或关闭 detail。
HTML5: &details&&/details&
HTML4: &dl style="display:hidden"&&/dl&
&embed& 标签定义嵌入的内容，比如插件。
HTML5: &embed src="horse.wav" /&
HTML4: &object data="flash.swf"
type="application/x-shockwave-flash"&&/object&
&figcaption& 标签定义 figure 元素的标题。”figcaption” 元素应该被置于 “figure” 元素的第一个或最后一个子元素的位置。
HTML5: &figure&&figcaption&PRC&/figcaption&&/figure&
HTML4: none
&figure& 标签用于对元素进行组合。使用 &figcaption& 元素为元素组添加标题。
HTML5: &figure&&figcaption&PRC&/figcaption&&p&The People's Republic of China was born in 1949...&/p&&/figure&
HTML4: &dl&&h1&PRC&/h1&&p&The People's Republic of China was born in 1949...&/p&&/dl&
&footer& 标签定义 section 或 document 的页脚。典型地，它会包含创作者的姓名、文档的创作日期以及/或者联系信息。
HTML5: &footer&&/footer&
HTML4: &div&&/div&
&header& 标签定义 section 或 document 的页眉。
HTML5: &header&&/header&
HTML4: &div&&/div&
&hgroup& 标签用于对网页或区段（section）的标题进行组合。
HTML5: &hgroup&&/hgroup&
HTML4: &div&&/div&
&keygen& 标签定义生成密钥。
HTML5: &keygen&
HTML4: none
&mark&主要用来在视觉上向用户呈现那些需要突出的文字。&mark&标签的一个比较典型的应用就是在搜索结果中向用户高亮显示搜索关键词。
HTML5: &mark&&/mark&
HTML4: &span&&/span&
&meter& 标签定义度量衡。仅用于已知最大和最小值的度量。必须定义度量的范围，既可以在元素的文本中，也可以在 min/max 属性中定义。
HTML5: &meter&&/meter&
HTML4: none
&nav& 标签定义导航链接的部分。
HTML5: &nav&&/nav&
HTML4:&ul&&/ul&
&output& 标签定义不同类型的输出，比如脚本的输出。
HTML5: &output&&/output&
HTML4: &span&&/span&
&progress& 标签运行中的进程。可以使用 &progress& 标签来显示 JavaScript 中耗费时间的函数的进程。
HTML5: &progress&&/progress&
HTML4: none
&rp& 标签在 ruby 注释中使用，以定义不支持 ruby 元素的浏览器所显示的内容。
HTML5: &ruby&漢 &rt&&rp&(&/rp&ㄏㄢˋ&rp&)&/rp&&/rt&&/ruby&
HTML4: none
&rt& 标签定义字符（中文注音或字符）的解释或发音。
HTML5: &ruby&漢 &rt& ㄏㄢˋ &/rt&&/ruby&
HTML4: none
&ruby& 标签定义 ruby 注释（中文注音或字符）。
HTML5: &ruby&漢 &rt&&rp&(&/rp&ㄏㄢˋ&rp&)&/rp&&/rt&&/ruby&
HTML4: none
&section& 标签定义文档中的节（section、区段）。比如章节、页眉、页脚或文档中的其他部分。
HTML5: &section&&/section&
HTML4: &div&&/div&
&source& 标签为媒介元素（比如 &video& 和 &audio&）定义媒介资源。
HTML5: &source&
HTML4: &param&
&summary& 标签包含 details 元素的标题，”details” 元素用于描述有关文档或文档片段的详细信息。”summary” 元素应该是 “details” 元素的第一个子元素。
HTML5: &details&&summary&HTML 5&/summary&This document teaches you everything you have to learn about HTML 5.&/details&
HTML4: none
&time& 标签定义日期或时间，或者两者。
HTML5: &time&&/time&
HTML4: &span&&/span&
&video& 标签定义视频，比如电影片段或其他视频流。
HTML5: &video src="movie.ogg" controls="controls"&您的浏览器不支持 video 标签。&/video&
HTML4:&object type="video/ogg" data="movie.ogv"&&param name="src" value="movie.ogv"&&/object&
HTML5新的input属性
新增加的属性描述如下：
autocomplete ：是否显示与现在输入内容相匹配的历史输入记录。
autofocus ：当页面加载完成后，此元素获得焦点。
form ：设置元素归属表单的ID。
formaction ：设置表单action属性的值。
formenctype ：设置表单enctype属性的值。
formmethod ：设置表单method属性的值。
formnovalidate ：关闭表单的验证。
formtarget ：设置表单target属性的值。
max ：设置&input&元素中数字或日期控件的最大值。
min ：设置&input&元素中数字或日期控件的最小值。
minlength ：设置文本输入控件的内容最小长度。
pattern ：设置元素文本内容需匹配的正则表达式。
placeholder ：设置文本控件的预先显示内容。
readonly ：设置元素是否只读。
required ：设置控件是否为必填项。
HTML5新的input控件
&input&元素type属性的值：
color ：颜色控件。
date ：日期控件。
email ：电子邮件地址输入框。
month ：年月日历控件。
number&：数值输入框。
range&：滑动条。
search&：搜索框。
tel ：电话号码输入框。
time ：时间控件。
url&：网址输入框。
week ：周数控件。
手机端html5触屏事件(touch事件)
touchstart：触摸开始的时候触发
touchmove：手指在屏幕上滑动的时候触发
touchend：触摸结束的时候触发
而每个触摸事件都包括了三个触摸列表，每个列表里包含了对应的一系列触摸点（用来实现多点触控）：
touches：当前位于屏幕上的所有手指的列表。
targetTouches：位于当前DOM元素上手指的列表。
changedTouches：涉及当前事件手指的列表。
每个触摸点由包含了如下触摸信息（常用）：
identifier：一个数值，唯一标识触摸会话（touch&session）中的当前手指。一般为从0开始的流水号（android4.1，uc）
target：DOM元素，是动作所针对的目标。
pageX/pageX/clientX/clientY/screenX/screenY：一个数值，动作在屏幕上发生的位置（page包含滚动距离,client不包含滚动距离，screen则以屏幕为基准）。　
radiusX/radiusY/rotationAngle：画出大约相当于手指形状的椭圆形，分别为椭圆形的两个半径和旋转角度。
var&obj&=&document.getElementByIdx_x('id');
obj.addEventListener('touchmove',&function(event)&{
&&&&&//&如果这个元素的位置内只有一个手指的话
&&&&if&(event.targetTouches.length&==&1)&{
　　　　&event.preventDefault();//&阻止浏览器默认事件，重要&
&&&&&&&&var&touch&=&event.targetTouches[0];
&&&&&&&&//&把元素放在手指所在的位置
&&&&&&&&obj.style.left&=&touch.pageX-50&+&'px';
&&&&&&&&obj.style.top&=&touch.pageY-50&+&'px';
},&false);
阅读(...) 评论()HTML5 Input 类型
HTML5 新的 Input 类型HTML5 拥有多个新的表单输入类型。这些新特性提供了更好的输入控制和验证。本章全面介绍这些新的输入类型：emailurlnumberrangeDate pickers (date, month, week, time, datetime, datetime-local)searchcolor
浏览器支持Input typeIEFirefoxOperaChromeSafariemailNo4.09.010.0NourlNo4.09.010.0NonumberNoNo9.07.0NorangeNoNo9.04.04.0Date pickersNoNo9.010.0NosearchNo4.011.010.0NocolorNoNo11.0NoNo注释：Opera 对新的输入类型的支持最好。不过您已经可以在所有主流的浏览器中使用它们了。即使不被支持，仍然可以显示为常规的文本域。
Input 类型 - emailemail 类型用于应该包含 e-mail 地址的输入域。在提交表单时，会自动验证 email 域的值。
实例E-mail:&&input&type=&email&&name=&user_email&&/&提示：iPhone 中的 Safari 浏览器支持 email 输入类型，并通过改变触摸屏键盘来配合它（添加 @ 和 .com 选项）。
Input 类型 - urlurl 类型用于应该包含 URL 地址的输入域。在提交表单时，会自动验证 url 域的值。
实例Homepage:&&input&type=&url&&name=&user_url&&/&提示：iPhone 中的 Safari 浏览器支持 url 输入类型，并通过改变触摸屏键盘来配合它（添加 .com 选项）。
Input 类型 - numbernumber 类型用于应该包含数值的输入域。您还能够设定对所接受的数字的限定：
实例Points:&&input&type=&number&&name=&points&&min=&1&&max=&10&&/&请使用下面的属性来规定对数字类型的限定：属性值描述maxnumber规定允许的最大值minnumber规定允许的最小值stepnumber规定合法的数字间隔（如果 step=&3&，则合法的数是 -3,0,3,6 等）valuenumber规定默认值请试一下带有所有限定属性的例子：亲自试一试提示：iPhone 中的 Safari 浏览器支持 number 输入类型，并通过改变触摸屏键盘来配合它（显示数字）。
Input 类型 - rangerange 类型用于应该包含一定范围内数字值的输入域。range 类型显示为滑动条。您还能够设定对所接受的数字的限定：
实例&input&type=&range&&name=&points&&min=&1&&max=&10&&/&请使用下面的属性来规定对数字类型的限定：属性值描述maxnumber规定允许的最大值minnumber规定允许的最小值stepnumber规定合法的数字间隔（如果 step=&3&，则合法的数是 -3,0,3,6 等）valuenumber规定默认值
Input 类型 - Date Pickers（日期选择器）HTML5 拥有多个可供选取日期和时间的新输入类型：date - 选取日、月、年month - 选取月、年week - 选取周和年time - 选取时间（小时和分钟）datetime - 选取时间、日、月、年（UTC 时间）datetime-local - 选取时间、日、月、年（本地时间）下面的例子允许您从日历中选取一个日期：
实例Date:&&input&type=&date&&name=&user_date&&/&Input 类型 - searchsearch 类型用于搜索域，比如站点搜索或 Google 搜索。search 域显示为常规的文本域。
Kingslogon
Copyright (C)
All Rights Reserved | 京ICP备 号-2H5中input type属性简写 - 博客频道 - CSDN.NET
冰三尺的Blog
J.stringify({_id:&_581267&,motto:&观千剑而后识, 操千曲而后晓声.&}, null, 5)
分类：JS ，number
1、html5中的input的type属性已经有tel、number、email的，还需要写正则去验证的吗？
2、html5中的input的type属性总共是新增了13个，type属性：
color（定义拾色器）
date（定义日期字段）
datetime（定义日期字段）
datetime-local（定义日期字段）
month（定义日期字段的月）
week（定义日期字段的周）
time（定义日期字段的时、分、秒）
email（定义用于 e-mail 地址的文本字段）
number（定义带有 spinner 控件的数字字段）
range（定义带有 slider 控件的数字字段）
search（定义用于搜索的文本字段）
tel（定义用于电话号码的文本字段）
url（定义用于 URL 的文本字段）
但是，type并不能作为验证依据,&type字段只是为输入提供选择格式,更多情况下应该说新增的type是为了适配移动端web
例如，说当type=tel的时候,在手机上打开页面会出现电话键盘(不是数字键盘,两者并不一样,电话键盘还包括*和#)
当type=email的时候,会出现带@和.com符号的全键盘(各设配各系统实现貌似有差异)
所以才要有pattern的存在,当触发表单提交的时候,浏览器会将输入与pattern属性做匹配来最终判断是否有效输入
当然了,后端验证数据有效性就在此问题的范畴之外了
PS 刚刚又试了一下,chrome下当type=email或者type=url的时候,触发提交,就算没有pattern也会对输入内容进行检查然后提示,但是type=tel却没有,Safari下则是全部都没有进行内容检查,这就是浏览器产商各自实现的差异了,为了保持浏览器行为的一致性,都应该加上pattern属性
另外，对于input type设置成number时maxlength属性失效的问题，可以查看W3C文档说明：
maxlength 属性与 &input type=&text&& 或 &input type=&password&& 配合使用。如果想要限制number长度，有以下两个参考：
1.type修改成“tel”，tel和number的不同之处在于，他们唤出的数字键盘略有不同
&input type=&number& oninput=&if(value.length&5)value=value.slice(0,5)& /&
//输入框为数字类型时防止maxlength属性不起作用
$('input').bind('input propertychange', function() {
if($(this).attr(&type&)==&number&){
//获取输入框的最大长度
var mxaL= $(this).attr(&maxlength&);
//如果输入的长度超过最大长度
if($(this).val().length&mxaL){
$(this).val($(this).val().slice(0,mxaL));
排名：千里之外
（4）（3）（1）（1）（1）（1）（1）（0）（1）（1）（1）（1）（1）（1）使用MUI的日期控件引起的探索——HTML5 input类型date属性 - 你不知道的巨蟹 - 博客园
&& 我写移动端的页面会用到MUI这个框架，个人觉得挺好用的，有很多实用的UI组件。当然坑还是有的， MUI官网，有兴趣的小伙伴可以看看
　虽然MUI也有自带的日历控件，但后台同事反映和后台数据交互起来比较麻烦，然后我就想到了用H5 input类型date属性。
　使用H5 input类型的date属性，添加&input type="month" name="" /&（显示年月）即可，会直接调用IOS和安卓手机上自带的本地日历控件。虽然H5的很多新属性在PC端的某些浏览器还不能很好的支持，同一个属性不同的浏览器可能解析也不一样；但移动端对H5的属性支持还是不错的，不用考虑太多浏览器的问题，主要就是IOS和安卓的适配。
　& 更多 H5 Input 类型请参考：.cn/html5/html_5_form_input_types.asp
注：使用H5 input date 属性以后还需要给确定按钮绑定change事件。这是因为点击日期以后，弹出日历选框（下图蓝色框部分），想等用户选择一个日期，选择确定以后在显示（下图红色框部分）同时把相应的数据加载出来，但是现在点了以后,弹出的选框（下图蓝色框部分）在滚动选择日期时候，（下图红色框部分）也会同步显示选择的日期，这样每次都会加载数据，造成不必要的请求，从而导致加载缓慢。
注：使用MUI的日历组件没有这个问题，下面随意滚动选择日期，上面的日期也不会变，等你点击确认以后才会变。
IOS和安卓手机调用自带本地日历控件显示的样式是不一样的，这个也没办法统一，如果想要统一的样式，那就只有找其他插件来代替了
推荐：/xfhxbb/lCalendar 这个博主写的日历插件，不依赖任何库，体积小（压缩过的js文件大概10多KB），使用简单。
IOS本地调用日历控件截图：
安卓本地调用日历控件截图：
补充说明：如果使用了H5 input的date属性，经本人测试在IOS上没有什么问题，但是系统比较老的安卓手机上会出现设置了&input type="month" /&属性时，依然会显示年月日，如下截图：
如果要兼容这些老版本系统的安卓手机，我能想到的办法还是只有用插件，上面我推荐的那个博主写的插件可以解决这个问题，如果哪位大神有更好的办法欢迎留言给予指点
注：使用了H5 input date属性以后，如果是在浏览器上（比如谷歌）查看显示效果的话，是这样的（如下图）；但不要担心，实际经本人测试在手机上查看的时候，（IOS和安卓手机）显示的是我上面截图的效果
阅读(...) 评论()
Powered By:}