HTML5有哪些功能?,html5新增一种非常重要的功能
当你在人群中谈论“HTML5”时，你可能会觉得自己像一个脱衣舞女或独角兽，带着明显的“我很酷，我知道”的意思来到房间中央。不能说我们虚荣。很多年了，基本的HTML API根本没有发展起来，以至于当一个小的新功能，比如占位符出现的时候，会让我们看起来很新奇。虽然新浏览器实现了很多HTML5的特性，但是大部分程序员还是不知道或者没听说过一些很小很有用的API。我将在本文中介绍其中的一些API，欢迎大家发现更多不为人知的HTML5 API！
Element.classList
ClassList API提供了一个我们使用多年的JavaScript工具库控制CSS的基本功能：
XML/HTML代码将内容复制到剪贴板//添加一个CSS类my element . class list . add( new class )；//删除一个CSS类my element . class list . remove( existing class )；//检查是否有CSS类my element . class list . contains( one class )；//反转CSS类是否有my element . class list . toggle( another class )；这个新API的主要价值在于它简单实用。阅读这篇文章，它介绍了其他几个classList特性。
ContextMenu API
这个新的ContextMenu API非常有用：它不会替换原来的右键菜单，而是将你自定义的右键菜单添加到浏览器的右键菜单中：
XML/HTML代码将内容复制到剪贴板sectioncontextmenu=mymenu ！-add menu-menu type= context id= my menu menuitem label= refresh post onclick= window . location . reload()；icon=/images/refresh-icon . png /menuitem menu label= share on . icon=/images/share _ icon . gif menuitem label= Twitter icon=/images/Twitter _ icon . gif onclick= goTo(//Twitter . com/intent/tweet？text= document . title : window . location . href)；/menuitem menuitemlabel=脸书 icon=/images/Facebook _ icon 16 x 16 . gif onclick= goTo(//Facebook . com/sharer/sharer . PHP？u= window . location . href)；/menuitem /menu /menu /section需要注意的是，最好使用JavaScript动态创建这些菜单代码，因为菜单事件最终会调用JavaScript来执行任务。如果用户禁止了JavaScript，右键菜单就不会生成，同时他也看不到菜单。
Element.dataset
使用dataset API，程序员可以很容易地获得或设置data-*自定义属性：
XML/HTML代码将内容复制到剪贴板/*以下面的代码为例：divid= my div data-name= my div data-id= myid data-my-custom-key= this is value /div *//Get element=document . getelementbyid( my div )//Get id varid=element . dataset . id；//读取“data-my-custom-key”的值varcustomkey=element . dataset . mycustomkey；//将其修改为另一个value元素；数据集；mycustomkey=某个其他值；//结果是：//divid= my div data-name= my div data-id= myid data-my-custom-key=某个其他值/div。不用说，它和classList一样简单实用。
window.postMessage API
甚至IE8已经支持postMessage API很多年了。postMessage API的功能是让您在两个浏览器窗口或iframe之间传输信息数据：
代码将内容复制到剪贴板//从域A或iframe中的窗口向域B中的窗口或ifame vari frame window=document . getelementbyid( iframe )发送消息。内容窗口；IframeWindow.postMessage(来自第一个窗口的问候！);//接收消息window . addevent listener( message ，function(event){//检查域的合法性if(event . origin== 3358 www . webhek . com ){//输出日志信息console . log(event . data)；//反馈消息event.source.postMessage(你好！);} ]);消息体只能是字符串，但是可以用JSON.stringify和JSON.parse把消息转换成更有意义的数据体！
autofocus属性
Autofocus属性使BUTTON、INPUT或TEXTAREA元素在页面加载时自动成为页面的焦点：
XML/HTML代码将内容复制到剪贴板inpututofocus= auto focus /button auto focus= auto focus 嗨！/Button TextArea autofocus= auto focus /TextArea在Google搜索页面这样有固定模式的地方，auto focus属性是最理想的功能。
浏览器对每个API的支持略有不同，所以在使用它们之前要检查对这些特性的支持。花点时间阅读每个API的详细描述，相信你会发现更多。
这就是本文的全部内容。希望对大家的学习和支持有帮助。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。