• HTML5


    一、HTML5增加元素

    <canvas> </canvas>    用于图形绘制,通过脚本(常用JS)来完成;具体请参考JavaScript;
    <svg> </svg>         矢量图,支持内联;
    <math> </math>        用于书写数学字符;
    <video> </video>      显示视频;(支持MP4,WebM,Ogg);内容里边需要有sorce标签给定的源文件;具体请参考JavaScript;
    <audio> </audio>      显示视频;(支持MP3,wav,Ogg);内容里边需要有sorce标签给定的源文件;具体请参考JavaScript;
    <source>              定义media元素 (<video><audio>)的媒体资源
    <bdi> </bdi>          设置一段文本的方向,可与父元素方向不同;
    <mark> </mark>        带有记号的文本;
    <time> </time>        时间;属性有datetime
    <embed>               一个容器,可用来嵌入部应用或插件,属性有width,height,src,type;

     二、新的元素和属性

    (一)新的<input>标签中新增属性

     1 type属性新增值:
     2     color          颜色选择框;
     3     date            日期选择器(部分浏览器不支持);
     4     datetime-local  日期和时间选择器;
     5     time            时间选择器;
     6     week          周选择器;
     7     email           邮件地址验证;
     8     url             url验证;
     9     month         月份选择;
    10     number        数值输入,可用以下属性进行更多限定,    disabled,max,min,maxlengh,pattern(正则表达式),readonly,requried,size,step,value;
    11     range          数值选择,显示为一个滑块,需用更多属性进行限定:max,min,step,value;
    12 autofocus          不需要值,如果给定此属性,则在加载页面时输入域自动获得焦点;
    13 form               设置输入域属于某一个或多个表单,多个表单之间用空格分隔;
    14 formaction         值会覆盖<form>元素中的action属性;
    15 formenctype        值会覆盖<form>元素中的enctype属性;
    16 formmethod         值会覆盖<form>元素中的method属性;
    17 formnovalidate     值会覆盖<form>元素中的novalidate属性;
    18 formtarget         值会覆盖<form>元素中的target属性;
    19 height             设置image类型<input>标签高度;
    20 width              设置image类型<imput>标签宽度;
    21 multiple           不需要值,如果给定此属性,则在输入元素中可选择多个值;
    22 pattern            值为正则表达式,用来验证输入值;
    23 placeholder        值为用来显示在输入域中来提示用户;
    24 requried           不需要值,如给定此属性,则输入不能为空;

    (二)新的表单元素

    1 <datalist> </datalist><input>一起使用,来设定预定义值,每个值用<option value="value">来设定;
    2 <keygen>                      提交表单时会生成私钥和公钥两个键,私钥存于客户端,公钥发送给服务器;
    3 <output>                      元素用于不同类型的输出,比如计算或脚本输出.
    4 
    5 <form>/<input>的autocomplete属性,如果值为on则会保留最后一次输入的值作为下次输入的默认值,如果为off则不会记录保留;
    6 <form>的novalidate属性,不需要值,如果给定了此属性则在提交表单时不应该验证 form 或 input 域。

    (三)新的语义元素

    1 语义元素用来明确一个Web页面的不同部分;
    2 <header> </header>
    3 <nav> </nav>                定义导航链接的部分;
    4 <section> </section>        定义文档中的节;
    5 <article> </article>        标签定义独立的内容;
    6 <aside> </aside>            定义页面主区域内容之外的内容;
    7 <figcaption> </figcaption>  <figure> 元素的标题,应该被置于 "figure" 元素的第一个或最后一个子元素的位置;
    8 <figure> </figure>          标签规定独立的流内容(图像、图表、照片、代码等等),元素的内容应该与主内容相关,但如果被删除,则不应对文档流产生影响。
    9 <footer> </footer>          描述了文档的底部区域;

    (四)新的全局属性

    1 contenteditable                元素是否可编辑,值有true,false;
    2 contextmenu                    指定一个元素的上下文菜单。当用户右击该元素,出现上下文菜单,值为要打开<menu>元素的id;
    3 data-*                         存储页面的自定义数据;
    4 draggable                      元素是否可拖动,值有true,false,auto;
    5 hidden    

    (五)新的存储方式

    localStorage                 本地存储,永久性的;

    sessionStrorage           针对一个 session 进行数据存储。当用户关闭浏览器窗口后,数据会被删除;

    但这两种方式的都是通过脚本来实现的;

    三、全局事件属性

    (html4后支持,主要用于浏览器触发事件后运行的脚本,值都是script):

    1.窗口事件属性

     1     onafterprint         打印文档后运行脚本;
     2     onbeforeprint        打印文档前;
     3     onbeforeonload       文档加载前;
     4     onload               文档加载时;
     5     onoffline            文档离线时;
     6     ononline             文档上线时;
     7     onhaschange          文档改变时;
     8     onredo               文档再次执行时;
     9     onundo               文档执行撤销时;
    10     onerror              出现错误时;
    11     onmessage            触发消息时;
    12     onunload             用户离开文档时;
    13     onblur               窗口失去焦点时;
    14     onfocus              窗口获得焦点时;
    15     onpagehide           窗口隐藏时;
    16     onpageshow           窗口可见时;
    17     onpopstate           窗口历史记录改变时;
    18     onresize             窗口大小改变时;
    19     onstorage            web storage区域更新时;

    2.表单事件属性

     1     onblur                元素失去焦点时;
     2     onfocus               元素获得焦点时;
     3     onchange              元素改变时;
     4     oncontextmenu         触发上下文菜单时;
     5     onformchange          表单改变时;
     6     onforminput           表单获得用户输入里
     7     oninput               当元素获得用户输入时;
     8     oninvalid             元素无效时;
     9     onselect              选取元素时;
    10     onsubmit              提交表单时;

    3.键鼠事件属性

     1     onkeydown              按下按键时;        
     2     onkeyup                松开按键时;
     3     onkeypress             按下并松开按键时;
     4     onclick                鼠标点击时;
     5     ondblclick             鼠标双击元素时;
     6     onmousedown            按下鼠标时;
     7     onmouseup              松开鼠标时;
     8     onmousemove            鼠标指针移动时;
     9     onmouseout             鼠标指针移出元素时;
    10     onmouseover            鼠标指针移至元素上时;
    11     ondrag                 拖动元素时;
    12     ondraged               拖动操作结束时;
    13     ondragstart            拖动操作开始时;
    14     ondrop                 元素正在被拖动过程中时;
    15     ondragleave            当元素离开有效拖放目标时;
    16     ondrageover            当元素被拖动至有效目标上方时;
    17     onmousewheel           鼠标滚轮滚动时;
    18     onscroll               当滚动元素的滚动条时;

    4.多媒体事件属性

     1     onabort               发生中止事件时;
     2     oncanplay             媒介能够开始播放,但可能因缓冲需要停止时;
     3     oncanplaythrough     媒介无需因缓冲而停止可播放至结尾时;
     4     ondurationchange      媒介长度改变时;
     5     onemptied             媒体元素突然为空时;
     6     onended               媒体已抵达结尾时;
     7     onerror               媒体元素加载发生错误时;
     8     onloaddaata           加载媒体数据时;
     9     onloadedmetadata      媒体持续时间以及其他媒体数据已加载时;
    10     onloadstart           开始加载媒体数据时;
    11     onpause               媒体数据暂停运行时;
    12     onplay                媒体数据将要开始播放时;
    13     onplaying             媒体数据正在播放时;
    14     onprogress            当浏览器正在取媒体数据时;
    15     onratechange          当媒体数据播放速率改变时;
    16     onreadystatechange    就绪状态改变时;
    17     onseeked              媒体元素定位属性不再为真且已定位结束时;
    18     onseeking             媒体元素定位为真且定位已开始时;
    19     onstalled             取回媒体数据过程中存在错误时;
    20     onsuspend             浏览器已在取媒体数据但在取回整下媒体文件前停止时;
    21     ontimeupdate          媒体改变其播放位置时;
    22     onvolumechange        媒体音量改变时;
    23     onwaiting             媒体已停止播放但打算继续播放时;

    5.其他

           onshow                       <menu>元素在上下文显示时;

           ontoggle               用户打开或关闭<details>时;

    注:文中的新增都是在HTML基础上新增的。

  • 相关阅读:
    [leetcode] Copy List with Random Pointer
    [leetcode] Single Number II
    团队项目NABCD模型的需求分析
    团队项目的分工及绩效评估方法
    软件工程结对作业实验报告
    Java jdbc链接 mySQL 写的crud
    从高版本JDK换成低版本JDK报错Unsupported major.minor version 52.0的解决方案
    红黑树简介
    再学HTML之一
    Java script 的dom编程
  • 原文地址:https://www.cnblogs.com/aland-1415/p/8490824.html
Copyright © 2020-2023  润新知