html5的功能有哪些,html5如何使用
不能说我们虚荣。很多年了，基本的HTML API根本没有发展起来，以至于当一个小的新功能，比如占位符出现的时候，会让我们看起来很新奇。虽然新浏览器实现了很多HTML5的特性，但是大部分程序员还是不知道或者没听说过一些很小很有用的API。我将在本文中介绍其中的一些API，欢迎大家发现更多不为人知的HTML5 API！
Element.classList
ClassList API提供了一个我们用JavaScript工具库实现了多年的控制CSS的基本功能：复制代码代码如下：
//添加一个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的主要价值在于它简单实用。
ContextMenu API
这个新的ContextMenu API非常有用：它不会替换原来的右键菜单，而是将你自定义的右键菜单添加到浏览器的右键菜单中：
复制代码如下：
section contextmenu=mymenu
！-添加菜单-
菜单类型=上下文 id=我的菜单
menuitem label= Refresh Post onclick= window . location . reload()；icon=/images/refresh-icon . png /menuitem
菜单标签=共享于.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
menuitem label=脸书 icon=/images/Facebook _ icon 16 x 16 . gif onclick= goTo(//Facebook . com/sharer/sharer . PHP？u= window . location . href)；/menuitem
/菜单
/菜单
/部分
需要注意的是，最好使用JavaScript动态创建这些菜单代码，因为菜单事件最终会调用JavaScript执行任务。如果用户禁止了JavaScript，右键菜单就不会生成，同时他也看不到菜单。
Element.dataset
使用dataset API，程序员可以很容易地获得或设置data-*自定义属性：
复制代码如下：
/*以下面的代码为例
div id= my div data-name= my div data-id= myId data-my-custom-key=这是值/div
*/
//获取元素
var element=document . getelementbyid( my div )；
//获取id
var id=element . dataset . id；
//读取“我的数据自定义密钥”的值
var custom key=element . dataset . mycustomkey；
//修改为其他值
element.dataset.myCustomKey=某个其他值；
//结果是：
//div id= 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中的window或iframe向域b中的window或ifame发送消息。
var iframe window=document . getelementbyid( iframe )。内容窗口；
IframeWindow.postMessage(来自第一个窗口的问候！);/pp//在另一个不同域的窗口或iframe中接收消息
window . addevent listener( message ，function(event) {
//检查域的合法性
if(event.origin==https://) {
//输出日志信息
console . log(event . data)；
//反馈消息
Event.source.postMessage(你好！);
}
]);
消息体只能是字符串，但是可以用JSON.stringify和JSON.parse把消息转换成更有意义的数据体！
autofocus属性
Autofocus属性使按钮、输入或TEXTAREA元素在页面加载时自动成为页面的焦点：复制如下代码：
输入自动对焦=自动对焦/
按钮自动对焦=自动对焦嗨！/按钮
textarea auto focus= auto focus /textarea
在谷歌搜索页面这种模式固定的地方，自动对焦属性是最理想的功能。
浏览器对每个API的支持略有不同，所以在使用它们之前要检查对这些特性的支持。花点时间阅读每个API的详细描述，相信你会发现更多。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。