{"id":834,"date":"2021-12-18T19:51:52","date_gmt":"2021-12-18T11:51:52","guid":{"rendered":"https:\/\/blog.cauchyschwarz.com\/?p=834"},"modified":"2021-12-18T19:51:56","modified_gmt":"2021-12-18T11:51:56","slug":"html5","status":"publish","type":"post","link":"https:\/\/blog.cauchyschwarz.com\/?p=834","title":{"rendered":"html5"},"content":{"rendered":"\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_82_2 ez-toc-wrap-right counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-69e89ddf597e9\" class=\"ez-toc-cssicon-toggle-label\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-69e89ddf597e9\" checked aria-label=\"Toggle\" \/><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-1'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E4%BB%80%E4%B9%88%E6%98%AFHTML5\" >\u4ec0\u4e48\u662fHTML5<\/a><ul class='ez-toc-list-level-2' ><li class='ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#HTML5%E6%98%AF%E5%A6%82%E4%BD%95%E8%B5%B7%E6%AD%A5%E7%9A%84\" >HTML5\u662f\u5982\u4f55\u8d77\u6b65\u7684?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E6%96%B0%E7%89%B9%E6%80%A7\" >\u65b0\u7279\u6027<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-1'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E8%A7%86%E9%A2%91\" >\u89c6\u9891<\/a><ul class='ez-toc-list-level-2' ><li class='ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#video%E6%A0%87%E7%AD%BE%E7%9A%84%E5%B1%9E%E6%80%A7\" >video\u6807\u7b7e\u7684\u5c5e\u6027<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#video%E6%94%AF%E6%8C%81%E7%9A%84%E8%A7%86%E9%A2%91%E6%96%B9%E6%B3%95%E3%80%81%E5%B1%9E%E6%80%A7%E5%92%8C%E4%BA%8B%E4%BB%B6\" >video\u652f\u6301\u7684\u89c6\u9891\u65b9\u6cd5\u3001\u5c5e\u6027\u548c\u4e8b\u4ef6<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-1'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E9%9F%B3%E9%A2%91\" >\u97f3\u9891<\/a><ul class='ez-toc-list-level-2' ><li class='ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#audio%E6%A0%87%E7%AD%BE%E7%9A%84%E5%B1%9E%E6%80%A7\" >audio\u6807\u7b7e\u7684\u5c5e\u6027<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-1'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E7%94%BB%E5%B8%83\" >\u753b\u5e03<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-1'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#SVG\" >SVG<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-1'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E5%9C%B0%E7%90%86%E5%AE%9A%E4%BD%8D\" >\u5730\u7406\u5b9a\u4f4d<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-1'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#Web%E5%AD%98%E5%82%A8\" >Web\u5b58\u50a8<\/a><ul class='ez-toc-list-level-2' ><li class='ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#localStorage%E6%96%B9%E6%B3%95\" >localStorage\u65b9\u6cd5<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#sessionStorage%E6%96%B9%E6%B3%95\" >sessionStorage\u65b9\u6cd5##<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-1'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E5%BA%94%E7%94%A8%E7%BC%93%E5%AD%98\" >\u5e94\u7528\u7f13\u5b58<\/a><ul class='ez-toc-list-level-2' ><li class='ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-16\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#HTML5_Cache_Manifest%E5%AE%9E%E4%BE%8B\" >HTML5 Cache Manifest\u5b9e\u4f8b<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-17\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#Cache_Manifest%E5%9F%BA%E7%A1%80\" >Cache Manifest\u57fa\u7840<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-18\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#Manifest%E6%96%87%E4%BB%B6\" >Manifest\u6587\u4ef6<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-19\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E6%9B%B4%E6%96%B0%E7%BC%93%E5%AD%98\" >\u66f4\u65b0\u7f13\u5b58<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-1'><a class=\"ez-toc-link ez-toc-heading-20\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#Web_Workers\" >Web Workers<\/a><ul class='ez-toc-list-level-2' ><li class='ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-21\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E6%A3%80%E6%B5%8BWeb_Worker%E6%94%AF%E6%8C%81\" >\u68c0\u6d4bWeb Worker\u652f\u6301<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-22\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E5%88%9B%E5%BB%BAweb_worker%E6%96%87%E4%BB%B6\" >\u521b\u5efaweb worker\u6587\u4ef6<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-23\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E5%88%9B%E5%BB%BAweb_worker%E5%AF%B9%E8%B1%A1\" >\u521b\u5efaweb worker\u5bf9\u8c61<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-24\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E7%BB%88%E6%AD%A2web_worker\" >\u7ec8\u6b62web worker<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-25\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#Web_Workers%E5%92%8CDOM\" >Web Workers\u548cDOM<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-1'><a class=\"ez-toc-link ez-toc-heading-26\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E6%9C%8D%E5%8A%A1%E5%99%A8%E5%8F%91%E9%80%81%E4%BA%8B%E4%BB%B6\" >\u670d\u52a1\u5668\u53d1\u9001\u4e8b\u4ef6<\/a><ul class='ez-toc-list-level-2' ><li class='ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-27\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#Server-Sent%E4%BA%8B%E4%BB%B6_%E5%8D%95%E5%90%91%E6%B6%88%E6%81%AF%E4%BC%A0%E9%80%92\" >Server-Sent\u4e8b\u4ef6 \u5355\u5411\u6d88\u606f\u4f20\u9012##<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-28\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E6%8E%A5%E6%94%B6Server-Sent%E4%BA%8B%E4%BB%B6%E9%80%9A%E7%9F%A5\" >\u63a5\u6536Server-Sent\u4e8b\u4ef6\u901a\u77e5<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-29\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E6%A3%80%E6%B5%8BServer-Sent%E4%BA%8B%E4%BB%B6%E6%94%AF%E6%8C%81\" >\u68c0\u6d4bServer-Sent\u4e8b\u4ef6\u652f\u6301<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-30\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#%E6%9C%8D%E5%8A%A1%E5%99%A8%E7%AB%AF%E4%BB%A3%E7%A0%81%E5%AE%9E%E4%BE%8B\" >\u670d\u52a1\u5668\u7aef\u4ee3\u7801\u5b9e\u4f8b<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-31\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#EventSource%E5%AF%B9%E8%B1%A1\" >EventSource\u5bf9\u8c61<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-1'><a class=\"ez-toc-link ez-toc-heading-32\" href=\"https:\/\/blog.cauchyschwarz.com\/?p=834\/#HTML5%E8%A1%A8%E5%8D%95\" >HTML5\u8868\u5355<\/a><\/li><\/ul><\/nav><\/div>\n<h1 class=\"wp-block-heading\" id=\"%E4%BB%80%E4%B9%88%E6%98%AFhtml5\"><span class=\"ez-toc-section\" id=\"%E4%BB%80%E4%B9%88%E6%98%AFHTML5\"><\/span>\u4ec0\u4e48\u662fHTML5<span class=\"ez-toc-section-end\"><\/span><\/h1>\n\n\n\n<p>HTML5\u5c06\u6210\u4e3aHTML\u3001XHTML\u4ee5\u53caHTML DOM\u7684\u65b0\u6807\u51c6\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"html5%E6%98%AF%E5%A6%82%E4%BD%95%E8%B5%B7%E6%AD%A5%E7%9A%84\"><span class=\"ez-toc-section\" id=\"HTML5%E6%98%AF%E5%A6%82%E4%BD%95%E8%B5%B7%E6%AD%A5%E7%9A%84\"><\/span>HTML5\u662f\u5982\u4f55\u8d77\u6b65\u7684?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>W3C\u4e0eWHATWG\u5408\u4f5c\u7684\u7ed3\u679c\u3002<br>W3C: World Wide Web Consortium\uff0c\u4e07\u7ef4\u7f51\u8054\u76df\u3002<br>WHATWG: Web Hypertext Application Technology Working Group\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"%E6%96%B0%E7%89%B9%E6%80%A7\"><span class=\"ez-toc-section\" id=\"%E6%96%B0%E7%89%B9%E6%80%A7\"><\/span>\u65b0\u7279\u6027<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>\u7528\u4e8e\u7ed8\u753b\u7684canvas\u5143\u7d20<\/li><li>\u7528\u4e8e\u5a92\u4ecb\u56de\u653e\u7684video\u548caudio\u5143\u7d20<\/li><li>\u5bf9\u672c\u5730\u79bb\u7ebf\u5b58\u50a8\u7684\u66f4\u597d\u7684\u652f\u6301<\/li><li>\u65b0\u7684\u7279\u6b8a\u5185\u5bb9\u5143\u7d20,\u6bd4\u5982article\u3001footer\u3001header\u3001nav\u3001section<\/li><li>\u65b0\u7684\u8868\u5355\u63a7\u4ef6\uff0c\u6bd4\u5982calendar,date,time,email,url,search<\/li><\/ul>\n\n\n\n<h1 class=\"wp-block-heading\" id=\"%E8%A7%86%E9%A2%91\"><span class=\"ez-toc-section\" id=\"%E8%A7%86%E9%A2%91\"><\/span>\u89c6\u9891<span class=\"ez-toc-section-end\"><\/span><\/h1>\n\n\n\n<p>HTML5\u89c4\u5b9a\u4e86\u4e00\u79cd\u901a\u8fc7video\u5143\u7d20\u6765\u5305\u542b\u89c6\u9891\u7684\u6807\u51c6\u65b9\u6cd5\u800c\u4e0d\u662f\u901a\u8fc7\u5916\u90e8\u63a7\u4ef6\u3002\u5f53\u524dvideo\u5143\u7d20\u652f\u6301\u4e09\u79cd\u89c6\u9891\u683c\u5f0f\uff1a<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Ogg<br>\u5e26\u6709Theora\u89c6\u9891\u7f16\u7801\u548cVorbis\u97f3\u9891\u7f16\u7801\u7684Ogg\u6587\u4ef6<\/li><li>MPEG4<br>\u5e26\u6709H.264\u89c6\u9891\u7f16\u7801\u548cAAC\u97f3\u9891\u7f16\u7801\u7684MPEG 4\u6587\u4ef6<\/li><li>WebM<br>\u5e26\u6709VP8\u89c6\u9891\u7f16\u7801\u548cVorbis\u97f3\u9891\u7f16\u7801\u7684WebM\u6587\u4ef6<\/li><\/ul>\n\n\n\n<p>\u4ee3\u7801\u4e3e\u4f8b:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">&lt;video width=\"320\" height=\"240\" controls=\"controls\"&gt;\n  &lt;source src=\"movie.ogg\" type=\"video\/ogg\"&gt;\n  &lt;source src=\"movie.mp4\" type=\"video\/mp4\"&gt;\nYour browser does not support the video tag.\n&lt;\/video&gt;\n<\/code><\/pre>\n\n\n\n<p>\u4e0a\u9762\u7684\u4ee3\u7801\u4e2d\u6709 \u591a\u4e2asource\uff0c\u6d4f\u89c8\u5668\u5c06\u4f7f\u7528\u7b2c\u4e00\u4e2a\u53ef\u8bc6\u522b\u7684\u683c\u5f0f\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"video%E6%A0%87%E7%AD%BE%E7%9A%84%E5%B1%9E%E6%80%A7\"><span class=\"ez-toc-section\" id=\"video%E6%A0%87%E7%AD%BE%E7%9A%84%E5%B1%9E%E6%80%A7\"><\/span>video\u6807\u7b7e\u7684\u5c5e\u6027<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th>\u5c5e\u6027<\/th><th>\u503c<\/th><th>\u63cf\u8ff0<\/th><\/tr><\/thead><tbody><tr><td>autoplay<\/td><td>autoplay<\/td><td>\u5982\u679c\u51fa\u73b0\u8be5\u5c5e\u6027\uff0c\u5219\u89c6\u9891\u5728\u5c31\u7eea\u540e\u9a6c\u4e0a\u64ad\u653e\u3002<\/td><\/tr><tr><td>controls<\/td><td>controls<\/td><td>\u5982\u679c\u51fa\u73b0\u8be5\u5c5e\u6027\uff0c\u5219\u5411\u7528\u6237\u663e\u793a\u63a7\u4ef6\uff0c\u6bd4\u5982\u64ad\u653e\u6309\u94ae\u3002<\/td><\/tr><tr><td>height<\/td><td>pixels<\/td><td>\u8bbe\u7f6e\u89c6\u9891\u64ad\u653e\u5668\u7684\u9ad8\u5ea6\u3002<\/td><\/tr><tr><td>loop<\/td><td>loop<\/td><td>\u5982\u679c\u51fa\u73b0\u8be5\u5c5e\u6027\uff0c\u5219\u5f53\u5a92\u4ecb\u6587\u4ef6\u5b8c\u6210\u64ad\u653e\u540e\u518d\u6b21\u5f00\u59cb\u64ad\u653e\u3002<\/td><\/tr><tr><td>preload<\/td><td>preload<\/td><td>\u5982\u679c\u51fa\u73b0\u8be5\u5c5e\u6027\uff0c\u5219\u89c6\u9891\u5728\u9875\u9762\u52a0\u8f7d\u65f6\u8fdb\u884c\u52a0\u8f7d\uff0c\u5e76\u9884\u5907\u64ad\u653e\u3002\u5982\u679c\u4f7f\u7528&#8221;autoplay&#8221;\uff0c\u5219\u5ffd\u7565\u8be5\u5c5e\u6027\u3002<\/td><\/tr><tr><td>src<\/td><td>url<\/td><td>\u8981\u64ad\u653e\u7684\u89c6\u9891\u7684URL\u3002<\/td><\/tr><tr><td>width<\/td><td>pixels<\/td><td>\u8bbe\u7f6e\u89c6\u9891\u64ad\u653e\u5668\u7684\u5bbd\u5ea6\u3002<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"video%E6%94%AF%E6%8C%81%E7%9A%84%E8%A7%86%E9%A2%91%E6%96%B9%E6%B3%95%E5%B1%9E%E6%80%A7%E5%92%8C%E4%BA%8B%E4%BB%B6\"><span class=\"ez-toc-section\" id=\"video%E6%94%AF%E6%8C%81%E7%9A%84%E8%A7%86%E9%A2%91%E6%96%B9%E6%B3%95%E3%80%81%E5%B1%9E%E6%80%A7%E5%92%8C%E4%BA%8B%E4%BB%B6\"><\/span>video\u652f\u6301\u7684\u89c6\u9891\u65b9\u6cd5\u3001\u5c5e\u6027\u548c\u4e8b\u4ef6<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th>\u65b9\u6cd5<\/th><th>\u5c5e\u6027<\/th><th>\u4e8b\u4ef6<\/th><\/tr><\/thead><tbody><tr><td>play()<\/td><td>currentSrc<\/td><td>play<\/td><\/tr><tr><td>pause()<\/td><td>currentTime<\/td><td>pause<\/td><\/tr><tr><td>load()<\/td><td>vieoWidth<\/td><td>progress<\/td><\/tr><tr><td>canPlayType<\/td><td>videoHeight<\/td><td>error<\/td><\/tr><tr><td>\\<\/td><td>duration<\/td><td>timeupdate<\/td><\/tr><tr><td>\\<\/td><td>ended<\/td><td>ended<\/td><\/tr><tr><td>\\<\/td><td>error<\/td><td>abort<\/td><\/tr><tr><td>\\<\/td><td>paused<\/td><td>empty<\/td><\/tr><tr><td>\\<\/td><td>muted<\/td><td>emptied<\/td><\/tr><tr><td>\\<\/td><td>seeking<\/td><td>waiting<\/td><\/tr><tr><td>\\<\/td><td>volume<\/td><td>loadedmetadata<\/td><\/tr><tr><td>\\<\/td><td>height<\/td><td><\/td><\/tr><tr><td>\\<\/td><td>width<\/td><td><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p>\u5728\u6240\u6709\u5c5e\u6027\u4e2d\uff0c\u53ea\u6709videoWidth\u548cvideoHeight\u5c5e\u6027\u662f\u7acb\u5373\u53ef\u7528\u7684\u3002\u5728\u89c6\u9891\u7684\u5143\u6570\u636e\u5df2\u52a0\u8f7d\u540e\uff0c\u5176\u4ed6\u5c5e\u6027\u624d\u53ef\u7528\u3002<\/p>\n\n\n\n<h1 class=\"wp-block-heading\" id=\"%E9%9F%B3%E9%A2%91\"><span class=\"ez-toc-section\" id=\"%E9%9F%B3%E9%A2%91\"><\/span>\u97f3\u9891<span class=\"ez-toc-section-end\"><\/span><\/h1>\n\n\n\n<p>HTML5\u89c4\u5b9a\u4e86\u4e00\u79cd\u901a\u8fc7audio\u5143\u7d20\u6765\u5305\u542b\u97f3\u9891\u7684\u6807\u51c6\u65b9\u6cd5\u3002<br>audio\u5143\u7d20\u80fd\u591f\u64ad\u653e\u58f0\u97f3\u6587\u4ef6\u6216\u8005\u97f3\u9891\u6d41\u3002<br>audio\u652f\u6301\u4e09\u79cd\u97f3\u9891\u683c\u5f0f\uff1a<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Ogg Vorbis<\/li><li>MP3<\/li><li>Wav<br>audio\u6807\u7b7e\u4f7f\u7528\u65b9\u6cd5\u4e0evideo\u6807\u7b7e\u7c7b\u4f3c\u3002<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"audio%E6%A0%87%E7%AD%BE%E7%9A%84%E5%B1%9E%E6%80%A7\"><span class=\"ez-toc-section\" id=\"audio%E6%A0%87%E7%AD%BE%E7%9A%84%E5%B1%9E%E6%80%A7\"><\/span>audio\u6807\u7b7e\u7684\u5c5e\u6027<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th>\u5c5e\u6027<\/th><th>\u503c<\/th><th>\u63cf\u8ff0<\/th><\/tr><\/thead><tbody><tr><td>autoplay<\/td><td>autoplay<\/td><td>\u5982\u679c\u51fa\u73b0\u8be5\u5c5e\u6027\uff0c\u5219\u97f3\u9891\u5728\u5c31\u7eea\u540e\u9a6c\u4e0a\u64ad\u653e\u3002<\/td><\/tr><tr><td>controls<\/td><td>controls<\/td><td>\u5982\u679c\u51fa\u73b0\u8be5\u5c5e\u6027\uff0c\u5219\u5411\u7528\u6237\u663e\u793a\u63a7\u4ef6\uff0c\u6bd4\u5982\u64ad\u653e\u6309\u94ae\u3002<\/td><\/tr><tr><td>loop<\/td><td>loop<\/td><td>\u5982\u679c\u51fa\u73b0\u8be5\u5c5e\u6027\uff0c\u5219\u6bcf\u5f53\u97f3\u9891\u7ed3\u675f\u65f6\u91cd\u65b0\u5f00\u59cb\u64ad\u653e\u3002<\/td><\/tr><tr><td>preload<\/td><td>preload<\/td><td>\u5982\u679c\u51fa\u73b0\u8be5\u5c5e\u6027\uff0c\u5219\u97f3\u9891\u5728\u9875\u9762\u52a0\u8f7d\u65f6\u8fdb\u884c\u52a0\u8f7d\uff0c\u5e76\u9884\u5907\u64ad\u653e\u3002\u5982\u679c\u4f7f\u7528&#8221;autoplay&#8221;\uff0c\u5219\u5ffd\u7565\u8be5\u5c5e\u6027\u3002<\/td><\/tr><tr><td>src<\/td><td>url<\/td><td>\u8981\u64ad\u653e\u7684\u97f3\u9891\u7684URL\u3002<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h1 class=\"wp-block-heading\" id=\"%E7%94%BB%E5%B8%83\"><span class=\"ez-toc-section\" id=\"%E7%94%BB%E5%B8%83\"><\/span>\u753b\u5e03<span class=\"ez-toc-section-end\"><\/span><\/h1>\n\n\n\n<h1 class=\"wp-block-heading\" id=\"svg\"><span class=\"ez-toc-section\" id=\"SVG\"><\/span>SVG<span class=\"ez-toc-section-end\"><\/span><\/h1>\n\n\n\n<h1 class=\"wp-block-heading\" id=\"%E5%9C%B0%E7%90%86%E5%AE%9A%E4%BD%8D\"><span class=\"ez-toc-section\" id=\"%E5%9C%B0%E7%90%86%E5%AE%9A%E4%BD%8D\"><\/span>\u5730\u7406\u5b9a\u4f4d<span class=\"ez-toc-section-end\"><\/span><\/h1>\n\n\n\n<h1 class=\"wp-block-heading\" id=\"web%E5%AD%98%E5%82%A8\"><span class=\"ez-toc-section\" id=\"Web%E5%AD%98%E5%82%A8\"><\/span>Web\u5b58\u50a8<span class=\"ez-toc-section-end\"><\/span><\/h1>\n\n\n\n<p>HTML5\u63d0\u4f9b\u4e86\u4e24\u79cd\u5728\u5ba2\u6237\u7aef\u5b58\u50a8\u6570\u636e\u7684\u65b0\u65b9\u6cd5\uff1a<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>localStorage &#8211; \u6ca1\u6709\u65f6\u95f4\u9650\u5236\u7684\u6570\u636e\u5b58\u50a8<\/li><li>sessionStorage &#8211; \u9488\u5bf9\u4e00\u4e2asession\u7684\u6570\u636e\u5b58\u50a8<br>\u4e4b\u524d\uff0c\u8fd9\u4e9b\u90fd\u662f\u7531cookie\u5b8c\u6210\u7684\u3002\u4f46\u662fcookie\u4e0d\u9002\u5408\u5927\u91cf\u6570\u636e\u7684\u5b58\u50a8\uff0c\u56e0\u4e3a\u5b83\u4eec\u7531\u6bcf\u4e2a\u5bf9\u670d\u52a1\u5668\u7684\u8bf7\u6c42\u6765\u4f20\u9012\uff0c\u8fd9\u4f7f\u5f97cookie\u901f\u5ea6\u5f88\u6162\u800c\u4e14\u6548\u7387\u4e5f\u4e0d\u9ad8\u3002<br>\u5728HTML5\u4e2d\uff0c\u6570\u636e\u4e0d\u662f\u7531\u6bcf\u4e2a\u670d\u52a1\u5668\u8bf7\u6c42\u4f20\u9012\u7684\uff0c\u800c\u662f\u53ea\u6709\u5728\u8bf7\u6c42\u65f6\u4f7f\u7528\u6570\u636e\u3002\u5b83\u4f7f\u5728\u4e0d\u5f71\u54cd\u7f51\u7ad9\u6027\u80fd\u7684\u60c5\u51b5\u4e0b\u5b58\u50a8\u5927\u91cf\u6570\u636e\u6210\u4e3a\u53ef\u80fd\u3002<br>\u5bf9\u4e8e\u4e0d\u540c\u7684\u7f51\u7ad9\uff0c\u6570\u636e\u5b58\u50a8\u4e8e\u4e0d\u540c\u7684\u533a\u57df\uff0c\u5e76\u4e14\u4e00\u4e2a\u7f51\u7ad9\u53ea\u80fd\u8bbf\u95ee\u5176\u81ea\u8eab\u7684\u6570\u636e\u3002<br>HTML5\u4f7f\u7528JavaScript\u6765\u5b58\u50a8\u548c\u8bbf\u95ee\u6570\u636e\u3002<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"localstorage%E6%96%B9%E6%B3%95\"><span class=\"ez-toc-section\" id=\"localStorage%E6%96%B9%E6%B3%95\"><\/span>localStorage\u65b9\u6cd5<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>localStorage\u65b9\u6cd5\u5b58\u50a8\u7684\u6570\u636e\u6ca1\u6709\u65f6\u95f4\u9650\u5236\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"sessionstorage%E6%96%B9%E6%B3%95\"><span class=\"ez-toc-section\" id=\"sessionStorage%E6%96%B9%E6%B3%95\"><\/span>sessionStorage\u65b9\u6cd5##<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>sessionStorage\u65b9\u6cd5\u9488\u5bf9\u4e00\u4e2asession\u8fdb\u884c\u6570\u636e\u5b58\u50a8\u3002\u5f53\u7528\u6237\u5173\u95ed\u6d4f\u89c8\u5668\u7a97\u53e3\u540e\uff0c\u6570\u636e\u4f1a\u5220\u9664\u3002<\/p>\n\n\n\n<h1 class=\"wp-block-heading\" id=\"%E5%BA%94%E7%94%A8%E7%BC%93%E5%AD%98\"><span class=\"ez-toc-section\" id=\"%E5%BA%94%E7%94%A8%E7%BC%93%E5%AD%98\"><\/span>\u5e94\u7528\u7f13\u5b58<span class=\"ez-toc-section-end\"><\/span><\/h1>\n\n\n\n<p>HTML5\u5f15\u5165\u4e86\u5e94\u7528\u7a0b\u5e8f\u7f13\u5b58\uff0c\u8fd9\u610f\u5473\u7740web\u5e94\u7528\u53ef\u8fdb\u884c\u7f13\u5b58\uff0c\u5e76\u53ef\u5728\u6ca1\u6709\u56e0\u7279\u7f51\u8fde\u63a5\u65f6\u8fdb\u884c\u8bbf\u95ee\u3002<br>\u5e94\u7528\u7a0b\u5e8f\u7f13\u5b58\u4e3a\u5e94\u7528\u5e26\u6765\u4e09\u4e2a\u4f18\u52bf\uff1a<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>\u79bb\u7ebf\u6d4f\u89c8-\u7528\u6237\u53ef\u5728\u5e94\u7528\u79bb\u7ebf\u65f6\u4f7f\u7528\u5b83\u4eec<\/li><li>\u901f\u5ea6-\u5df2\u7f13\u5b58\u8d44\u6e90\u52a0\u8f7d\u5f97\u66f4\u5feb<\/li><li>\u51cf\u5c11\u670d\u52a1\u5668\u8d1f\u8f7d-\u6d4f\u89c8\u5668\u5c06\u53ea\u4ece\u670d\u52a1\u5668\u4e0b\u8f7d\u66f4\u65b0\u8fc7\u6216\u66f4\u6539\u8fc7\u7684\u8d44\u6e90<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"html5-cache-manifest%E5%AE%9E%E4%BE%8B\"><span class=\"ez-toc-section\" id=\"HTML5_Cache_Manifest%E5%AE%9E%E4%BE%8B\"><\/span>HTML5 Cache Manifest\u5b9e\u4f8b<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\u4e0b\u9762\u7684\u4f8b\u5b50\u5c55\u793a\u4e86\u5e26\u6709cache manifest\u7684HTML\u6587\u6863(\u4f9b\u79bb\u7ebf\u6d4f\u89c8):<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">&lt;!DOCTYPE HTML&gt;\n&lt;html manifest=\"demo.appcache\"&gt;\n\n&lt;body&gt;\nThe content of the document......\n&lt;\/body&gt;\n\n&lt;\/html&gt;\n<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"cache-manifest%E5%9F%BA%E7%A1%80\"><span class=\"ez-toc-section\" id=\"Cache_Manifest%E5%9F%BA%E7%A1%80\"><\/span>Cache Manifest\u57fa\u7840<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\u5982\u9700\u542f\u7528\u5e94\u7528\u7a0b\u5e8f\u7f13\u5b58\uff0c\u8bf7\u5728\u6587\u6863\u7684\u6807\u7b7e\u4e2d\u5305\u542bmanifest\u5c5e\u6027:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">&lt;!DOCTYPE HTML&gt;\n&lt;html manifest=\"demo.appcache\"&gt;\n...\n&lt;\/html&gt;\n<\/code><\/pre>\n\n\n\n<p>\u6bcf\u4e2a\u6307\u5b9a\u4e86manifest\u7684\u9875\u9762\u5728\u7528\u6237\u5bf9\u5176\u8bbf\u95ee\u65f6\u90fd\u4f1a\u88ab\u7f13\u5b58\u3002\u5982\u679c\u672a\u6307\u5b9amanifest\u5c5e\u6027\uff0c\u5219\u9875\u9762\u4e0d\u4f1a\u88ab\u7f13\u5b58(\u9664\u975e\u5728manifest\u6587\u4ef6\u4e2d\u76f4\u63a5\u6307\u5b9a\u4e86\u8be5\u9875\u9762)\u3002<br>manifest\u6587\u4ef6\u7684\u5efa\u8bae\u7684\u6587\u4ef6\u6269\u5c55\u540d\u662f: &#8220;.appcache&#8221;\u3002<br>\u8bf7\u6ce8\u610f\uff1amanifest\u6587\u4ef6\u9700\u8981\u914d\u7f6e\u6b63\u786e\u7684MIME-type\uff0c\u5373&#8221;text\/cache-manifest&#8221;\u3002\u5fc5\u987b\u5728web\u670d\u52a1\u5668\u4e0a\u8fdb\u884c\u914d\u7f6e\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"manifest%E6%96%87%E4%BB%B6\"><span class=\"ez-toc-section\" id=\"Manifest%E6%96%87%E4%BB%B6\"><\/span>Manifest\u6587\u4ef6<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>manifest\u6587\u4ef6\u662f\u7b80\u5355\u7684\u6587\u672c\u6587\u4ef6\uff0c\u5b83\u544a\u77e5\u6d4f\u89c8\u5668\u88ab\u7f13\u5b58\u7684\u5185\u5bb9(\u4ee5\u53ca\u4e0d\u7f13\u5b58\u7684\u5185\u5bb9)\u3002<br>manifest\u6587\u4ef6\u53ef\u5206\u4e3a\u4e09\u4e2a\u90e8\u5206\uff1a<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>CACHE MANIFEST &#8211; \u5728\u6b64\u6807\u9898\u4e0b\u5217\u51fa\u7684\u6587\u4ef6\u5c06\u5728\u9996\u6b21\u4e0b\u8f7d\u540e\u8fdb\u884c\u7f13\u5b58<\/li><li>NETWORK &#8211; \u5728\u6b64\u6807\u9898\u4e0b\u5217\u51fa\u7684\u6587\u4ef6\u9700\u8981\u4e0e\u670d\u52a1\u5668\u7684\u8fde\u63a5\uff0c\u4e14\u4e0d\u4f1a\u88ab\u7f13\u5b58<\/li><li>FALLBACK &#8211; \u5728\u6b64\u6807\u9898\u4e0b\u5217\u51fa\u7684\u6587\u4ef6\u89c4\u5b9a\u5f53\u9875\u9762\u65e0\u6cd5\u8bbf\u95ee\u65f6\u7684\u56de\u9000\u9875\u9762(\u6bd4\u5982404\u9875\u9762)<br>\u5b8c\u6574\u7684Manifest\u6587\u4ef6<\/li><\/ul>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">CACHE MANIFEST\n# 2012-02-21 v1.0.0\n\/theme.css\n\/logo.gif\n\/main.js\n\nNETWORK:\nlogin.asp\n\nFALLBACK:\n\/html5\/ \/404.html\n<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"%E6%9B%B4%E6%96%B0%E7%BC%93%E5%AD%98\"><span class=\"ez-toc-section\" id=\"%E6%9B%B4%E6%96%B0%E7%BC%93%E5%AD%98\"><\/span>\u66f4\u65b0\u7f13\u5b58<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\u4e00\u65e6\u5e94\u7528\u88ab\u7f13\u5b58\uff0c\u5b83\u5c31\u4f1a\u4fdd\u6301\u7f13\u5b58\u76f4\u5230\u53d1\u751f\u4e0b\u5217\u60c5\u51b5\uff1a<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>\u7528\u6237\u60c5\u51b5\u6d4f\u89c8\u5668\u7f13\u5b58<\/li><li>manifest\u6587\u4ef6\u88ab\u4fee\u6539<\/li><li>\u7531\u7a0b\u5e8f\u6765\u66f4\u65b0\u5e94\u7528\u7f13\u5b58<br>\u7531\u4e8e\u4e00\u65e6\u6587\u4ef6\u88ab\u7f13\u5b58\uff0c\u5219\u6d4f\u89c8\u5668\u4f1a\u7ee7\u7eed\u5c55\u793a\u5df2\u7f13\u5b58\u7684\u7248\u672c\uff0c\u5373\u4f7f\u60a8\u4fee\u6539\u4e86\u670d\u52a1\u5668\u4e0a\u7684\u6587\u4ef6\u3002\u6240\u4ee5\u4e3a\u4e86\u786e\u4fdd\u6d4f\u89c8\u5668\u66f4\u65b0\u7f13\u5b58\uff0c\u60a8\u9700\u8981\u66f4\u65b0manifest\u6587\u4ef6(\u8b6c\u5982\u66f4\u65b0\u4e0a\u9762\u7684\u4ee5&#8221;#&#8221;\u5f00\u5934\u7684\u6ce8\u91ca\u884c\u4e2d\u7684\u65e5\u671f\u548c\u7248\u672c\u53f7)\u3002<\/li><\/ul>\n\n\n\n<h1 class=\"wp-block-heading\" id=\"web-workers\"><span class=\"ez-toc-section\" id=\"Web_Workers\"><\/span>Web Workers<span class=\"ez-toc-section-end\"><\/span><\/h1>\n\n\n\n<p>\u5f53\u5728HTML\u9875\u9762\u4e2d\u6267\u884c\u811a\u672c\u65f6\uff0c\u9875\u9762\u7684\u72b6\u6001\u662f\u4e0d\u53ef\u54cd\u5e94\u7684\uff0c\u76f4\u5230\u811a\u672c\u5df2\u5b8c\u6210\u3002<br>web worker\u662f\u8fd0\u884c\u5728\u540e\u53f0\u7684JavaScript\uff0c\u72ec\u7acb\u4e8e\u5176\u4ed6\u811a\u672c\uff0c\u4e0d\u4f1a\u5f71\u54cd\u9875\u9762\u7684\u6027\u80fd\u3002\u60a8\u53ef\u4ee5\u7ee7\u7eed\u505a\u4efb\u4f55\u613f\u610f\u505a\u7684\u4e8b\u60c5\uff1a\u70b9\u51fb\u3001\u9009\u53d6\u5185\u5bb9\u7b49\u7b49\uff0c\u800c\u6b64\u65f6web worker\u5728\u540e\u53f0\u8fd0\u884c\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"%E6%A3%80%E6%B5%8Bweb-worker%E6%94%AF%E6%8C%81\"><span class=\"ez-toc-section\" id=\"%E6%A3%80%E6%B5%8BWeb_Worker%E6%94%AF%E6%8C%81\"><\/span>\u68c0\u6d4bWeb Worker\u652f\u6301<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\u5728\u521b\u5efaweb worker\u4e4b\u524d\uff0c\u68c0\u6d4b\u7528\u6237\u7684\u6d4f\u89c8\u5668\u662f\u5426\u652f\u6301\u5b83\uff1a<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">if(typeof(Worker)!==\"undefined\")\n  {\n  \/\/ Yes! Web worker support!\n  \/\/ Some code.....\n  }\nelse\n  {\n  \/\/ Sorry! No Web Worker support..\n  }\n<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"%E5%88%9B%E5%BB%BAweb-worker%E6%96%87%E4%BB%B6\"><span class=\"ez-toc-section\" id=\"%E5%88%9B%E5%BB%BAweb_worker%E6%96%87%E4%BB%B6\"><\/span>\u521b\u5efaweb worker\u6587\u4ef6<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>web worker\u7ebf\u7a0b\u7684\u4ee3\u7801\u5199\u5728\u4e00\u4e2a\u5916\u90e8js\u6587\u4ef6\u4e2d\uff0c\u6bd4\u5982&#8221;demo_worker.js&#8221;\u3002<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">var i=0;\n\nfunction timedCount()\n{\ni=i+1;\npostMessage(i);\nsetTimeout(\"timedCount()\",500);\n}\n\ntimedCount();\n<\/code><\/pre>\n\n\n\n<p>postMessage()\u65b9\u6cd5\u7528\u4e8e\u5411HTML\u9875\u9762\u4f20\u56de\u4e00\u6bb5\u6d88\u606f\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"%E5%88%9B%E5%BB%BAweb-worker%E5%AF%B9%E8%B1%A1\"><span class=\"ez-toc-section\" id=\"%E5%88%9B%E5%BB%BAweb_worker%E5%AF%B9%E8%B1%A1\"><\/span>\u521b\u5efaweb worker\u5bf9\u8c61<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\u6709\u4e86web worker\u6587\u4ef6\uff0c\u73b0\u5728\u4eceHTML\u9875\u9762\u8c03\u7528\u5b83\u3002<br>\u4e0b\u9762\u4ee3\u7801\u68c0\u6d4b\u662f\u5426\u5b58\u5728worker\uff0c\u5982\u679c\u4e0d\u5b58\u5728\uff0c\u521b\u5efa\u4e00\u4e2a\u65b0\u7684web worker\u5bf9\u8c61\uff0c\u7136\u540e\u8fd0\u884c&#8221;demo_worker.js&#8221;\u4e2d\u7684\u4ee3\u7801\uff1a<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">if(typeof(w)==\"undefined\"){\n  w=new Worker(\"demo_workers.js\");\n}\n<\/code><\/pre>\n\n\n\n<p>\u7136\u540e\u5411web worker\u6dfb\u52a0\u4e00\u4e2a&#8221;onmessage&#8221;\u4e8b\u4ef6\u76d1\u542c\u5668\uff1a<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">w.onmessage=function(event){\n    document.getElementById(\"result\").innerHTML = event.data;\n};\n<\/code><\/pre>\n\n\n\n<p>\u5f53web worker\u4f20\u9012\u6d88\u606f\u65f6\uff0c\u4f1a\u6267\u884c\u4e8b\u4ef6\u76d1\u542c\u5668\u4e2d\u7684\u4ee3\u7801\u3002event.data\u4e2d\u5b58\u6709\u6765\u81eaevent.data\u7684\u6570\u636e\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"%E7%BB%88%E6%AD%A2web-worker\"><span class=\"ez-toc-section\" id=\"%E7%BB%88%E6%AD%A2web_worker\"><\/span>\u7ec8\u6b62web worker<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\u5f53\u6211\u4eec\u521b\u5efaweb worker\u5bf9\u8c61\u540e\uff0c\u5b83\u4f1a\u7ee7\u7eed\u76d1\u542c\u6d88\u606f(\u5373\u4f7f\u5728\u5916\u90e8\u811a\u672c\u5b8c\u6210\u4e4b\u540e)\u76f4\u5230\u5176\u88ab\u7ec8\u6b62\u4e3a\u6b62\u3002<br>\u5982\u9700\u7ec8\u6b62web worker\uff0c\u5e76\u91ca\u653e\u6d4f\u89c8\u5668\/\u8ba1\u7b97\u673a\u8d44\u6e90\uff0c\u8bf7\u4f7f\u7528terminate()\u65b9\u6cd5\uff1a<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">w.terminate();\n<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"web-workers%E5%92%8Cdom\"><span class=\"ez-toc-section\" id=\"Web_Workers%E5%92%8CDOM\"><\/span>Web Workers\u548cDOM<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\u7531\u4e8eweb worker\u4f4d\u4e8e\u5916\u90e8\u6587\u4ef6\u4e2d\uff0c\u5b83\u4eec\u65e0\u6cd5\u8bbf\u95ee\u4e0b\u5217Javascript\u5bf9\u8c61\uff1a<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>window\u5bf9\u8c61<\/li><li>document\u5bf9\u8c61<\/li><li>parent\u5bf9\u8c61<\/li><\/ul>\n\n\n\n<h1 class=\"wp-block-heading\" id=\"%E6%9C%8D%E5%8A%A1%E5%99%A8%E5%8F%91%E9%80%81%E4%BA%8B%E4%BB%B6\"><span class=\"ez-toc-section\" id=\"%E6%9C%8D%E5%8A%A1%E5%99%A8%E5%8F%91%E9%80%81%E4%BA%8B%E4%BB%B6\"><\/span>\u670d\u52a1\u5668\u53d1\u9001\u4e8b\u4ef6<span class=\"ez-toc-section-end\"><\/span><\/h1>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"server-sent%E4%BA%8B%E4%BB%B6-%E5%8D%95%E5%90%91%E6%B6%88%E6%81%AF%E4%BC%A0%E9%80%92\"><span class=\"ez-toc-section\" id=\"Server-Sent%E4%BA%8B%E4%BB%B6_%E5%8D%95%E5%90%91%E6%B6%88%E6%81%AF%E4%BC%A0%E9%80%92\"><\/span>Server-Sent\u4e8b\u4ef6 \u5355\u5411\u6d88\u606f\u4f20\u9012##<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Server-Sent\u4e8b\u4ef6\u6307\u7684\u662f\u7f51\u9875\u81ea\u52a8\u83b7\u53d6\u6765\u81ea\u670d\u52a1\u5668\u7684\u66f4\u65b0\u3002<br>\u4ee5\u524d\u4e5f\u53ef\u80fd\u505a\u5230\u8fd9\u4e00\u70b9\uff0c\u524d\u63d0\u662f\u7f51\u9875\u4e0d\u5f97\u4e0d\u8be2\u95ee\u662f\u5426\u6709\u53ef\u7528\u7684\u66f4\u65b0\u3002\u901a\u8fc7\u670d\u52a1\u5668\u53d1\u9001\u4e8b\u4ef6\uff0c\u66f4\u65b0\u80fd\u591f\u81ea\u52a8\u5230\u8fbe\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"%E6%8E%A5%E6%94%B6server-sent%E4%BA%8B%E4%BB%B6%E9%80%9A%E7%9F%A5\"><span class=\"ez-toc-section\" id=\"%E6%8E%A5%E6%94%B6Server-Sent%E4%BA%8B%E4%BB%B6%E9%80%9A%E7%9F%A5\"><\/span>\u63a5\u6536Server-Sent\u4e8b\u4ef6\u901a\u77e5<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>EventSource\u5bf9\u8c61\u7528\u4e8e\u63a5\u6536\u670d\u52a1\u5668\u53d1\u9001\u4e8b\u4ef6\u901a\u77e5\uff1a<br>\u5b9e\u4f8b<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">var source = new EventSource(\"demo_sse.php\");\nsource.onmessage = function(event){\n    document.getElementById(\"result\").innerHTML += event.data + \"&lt;br \/&gt;\";\n}\n<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"%E6%A3%80%E6%B5%8Bserver-sent%E4%BA%8B%E4%BB%B6%E6%94%AF%E6%8C%81\"><span class=\"ez-toc-section\" id=\"%E6%A3%80%E6%B5%8BServer-Sent%E4%BA%8B%E4%BB%B6%E6%94%AF%E6%8C%81\"><\/span>\u68c0\u6d4bServer-Sent\u4e8b\u4ef6\u652f\u6301<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>\u53ef\u901a\u8fc7\u4e0b\u9762\u4ee3\u7801\u68c0\u6d4b\u670d\u52a1\u5668\u53d1\u9001\u4e8b\u4ef6\u7684\u6d4f\u89c8\u5668\u652f\u6301\u60c5\u51b5\uff1a<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">if(typeof(EventSource) !== \"undefined\"){\n    \/\/ \u652f\u6301  \n}else{\n    \/\/ \u4e0d\u652f\u6301  \n}\n<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"%E6%9C%8D%E5%8A%A1%E5%99%A8%E7%AB%AF%E4%BB%A3%E7%A0%81%E5%AE%9E%E4%BE%8B\"><span class=\"ez-toc-section\" id=\"%E6%9C%8D%E5%8A%A1%E5%99%A8%E7%AB%AF%E4%BB%A3%E7%A0%81%E5%AE%9E%E4%BE%8B\"><\/span>\u670d\u52a1\u5668\u7aef\u4ee3\u7801\u5b9e\u4f8b<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\u670d\u52a1\u5668\u7aef\u4e8b\u4ef6\u6d41\u7684\u8bed\u6cd5\u975e\u5e38\u7b80\u5355\uff0c\u628a&#8221;Content-Type&#8221;\u62a5\u5934\u8bbe\u7f6e\u4e3a&#8221;text\/event-stream&#8221;\u5373\u53ef\u3002<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">&lt;?php\nheader('Content-Type: text\/event-stream');\nheader('Cache-Control: no-cache');\n\n$time = date('r');\necho \"data: The server time is: {$time}\\n\\n\";\nflush();\n?&gt;\n<\/code><\/pre>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">&lt;%\nResponse.ContentType=\"text\/event-stream\"\nResponse.Expires=-1\nResponse.Write(\"data: \" &amp; now())\nResponse.Flush()\n%&gt;\n<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"eventsource%E5%AF%B9%E8%B1%A1\"><span class=\"ez-toc-section\" id=\"EventSource%E5%AF%B9%E8%B1%A1\"><\/span>EventSource\u5bf9\u8c61<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\u9664\u4e86onmessage\u4e8b\u4ef6\u6765\u83b7\u53d6\u6d88\u606f\uff0c\u8fd8\u53ef\u4ee5\u4f7f\u7528\u5176\u4ed6\u4e8b\u4ef6\u3002<\/p>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th>\u4e8b\u4ef6<\/th><th>\u63cf\u8ff0<\/th><\/tr><\/thead><tbody><tr><td>onopen<\/td><td>\u5f53\u901a\u5f80\u670d\u52a1\u5668\u7684\u8fde\u63a5\u88ab\u6253\u5f00<\/td><\/tr><tr><td>onmessage<\/td><td>\u5f53\u63a5\u6536\u5230\u6d88\u606f<\/td><\/tr><tr><td>onerror<\/td><td>\u5f53\u9519\u8bef\u53d1\u751f<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h1 class=\"wp-block-heading\" id=\"html5%E8%A1%A8%E5%8D%95\"><span class=\"ez-toc-section\" id=\"HTML5%E8%A1%A8%E5%8D%95\"><\/span>HTML5\u8868\u5355<span class=\"ez-toc-section-end\"><\/span><\/h1>\n\n\n\n<p>HTML5\u652f\u6301\u4e00\u7cfb\u5217\u65b0\u7684\u8f93\u5165\u7c7b\u578b\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Input\u7c7b\u578b-email<br>email\u7c7b\u578b\u5e94\u7528\u4e8e\u5e94\u8be5\u5305\u542be-mail\u5730\u5740\u7684\u8f93\u5165\u57df\u3002\u5728\u63d0\u4ea4\u8868\u5355\u65f6\uff0c\u4f1a\u81ea\u52a8\u9a8c\u8bc1email\u57df\u7684\u503c\u3002<\/li><\/ul>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">E-mail: &lt;input type=\"email\" name=\"user_email\" \/&gt;\n\n<\/code><\/pre>\n\n\n\n<ul class=\"wp-block-list\"><li>Input\u7c7b\u578b-url<br>url\u7c7b\u578b\u5e94\u7528\u4e8e\u5e94\u8be5\u5305\u542bURL\u5730\u5740\u7684\u8f93\u5165\u57df\u3002\u5728\u63d0\u4ea4\u8868\u5355\u65f6\uff0c\u4f1a\u81ea\u52a8\u9a8c\u8bc1url\u57df\u7684\u503c\u3002<\/li><\/ul>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">Homepage: &lt;input type=\"url\" name=\"user_url\" \/&gt;\n<\/code><\/pre>\n\n\n\n<ul class=\"wp-block-list\"><li>Input\u7c7b\u578b-number<br>number\u7c7b\u578b\u7528\u4e8e\u5e94\u8be5\u5305\u542b\u6570\u503c\u7684\u8f93\u5165\u57df\u3002\u60a8\u8fd8\u80fd\u591f\u8bbe\u5b9a\u5bf9\u6240\u63a5\u53d7\u7684\u6570\u5b57\u7684\u9650\u5b9a\uff1a<\/li><\/ul>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">Points: &lt;input type=\"number\" name=\"points\" min=\"1\" max=\"10\" \/&gt;\n<\/code><\/pre>\n\n\n\n<p>\u8bf7\u4f7f\u7528\u4e0b\u9762\u7684\u5c5e\u6027\u6765\u89c4\u5b9a\u5bf9\u6570\u5b57\u7c7b\u578b\u7684\u9650\u5b9a\uff1a<\/p>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th>\u5c5e\u6027<\/th><th>\u503c<\/th><th>\u63cf\u8ff0<\/th><\/tr><\/thead><tbody><tr><td>max<\/td><td>number<\/td><td>\u89c4\u5b9a\u5141\u8bb8\u7684\u6700\u5927\u503c<\/td><\/tr><tr><td>min<\/td><td>number<\/td><td>\u89c4\u5b9a\u8fd0\u884c\u7684\u6700\u5c0f\u503c<\/td><\/tr><tr><td>step<\/td><td>number<\/td><td>\u89c4\u5b9a\u5408\u6cd5\u7684\u6570\u5b57\u95f4\u9694(\u5982\u679cstep=&#8221;3&#8243;,\u5219\u5408\u6cd5\u7684\u6570\u662f-3, 0, 3, 6\u7b49)<\/td><\/tr><tr><td>value<\/td><td>number<\/td><td>\u89c4\u5b9a\u9ed8\u8ba4\u503c<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<ul class=\"wp-block-list\"><li>Input\u7c7b\u578b-range<br>range\u7c7b\u578b\u7528\u4e8e\u5e94\u8be5\u5305\u542b\u4e00\u5b9a\u8303\u56f4\u5185\u6570\u5b57\u503c\u5f97\u8f93\u5165\u57df\u3002range\u7c7b\u578b\u663e\u793a\u4e3a\u6ed1\u52a8\u6761\u3002\u60a8\u8fd8\u80fd\u591f\u8bbe\u5b9a\u5bf9\u6240\u63a5\u53d7\u7684\u6570\u5b57\u7684\u9650\u5b9a\u3002<\/li><\/ul>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">&lt;input type=\"range\" name=\"points\" min=\"1\" max=\"10\" \/&gt;\n<\/code><\/pre>\n\n\n\n<p>\u548cnumber\u4e00\u6837\uff0c\u53ef\u4f7f\u7528\u76f8\u5e94\u7684\u5c5e\u6027\u6765\u89c4\u5b9a\u5bf9\u6570\u5b57\u7c7b\u578b\u7684\u9650\u5b9a\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Input\u7c7b\u578b-Date Pickers(\u65e5\u671f\u9009\u62e9\u5668)<br>HTML5\u62e5\u6709\u591a\u4e2a\u53ef\u4f9b\u9009\u53d6\u65e5\u671f\u548c\u65f6\u95f4\u7684\u65b0\u8f93\u5165\u7c7b\u578b\uff1a<ul><li>date &#8211; \u9009\u53d6\u65e5\u3001\u6708\u3001\u5e74<\/li><li>month &#8211; \u9009\u53d6\u6708\u3001\u5e74<\/li><li>week &#8211; \u9009\u53d6\u5468\u548c\u5e74<\/li><li>time &#8211; \u9009\u53d6\u65f6\u95f4(\u5c0f\u65f6\u548c\u5206\u949f)<\/li><li>datetime &#8211; \u9009\u53d6\u65f6\u95f4\u3001\u65e5\u3001\u6708\u3001\u5e74(UTC\u65f6\u95f4)<\/li><\/ul>\u5b9e\u4f8b\uff1a<\/li><\/ul>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">Date: &lt;input type=\"date\" name=\"user_date\" \/&gt;\n<\/code><\/pre>\n\n\n\n<ul class=\"wp-block-list\"><li>Input\u7c7b\u578b-search<br>search\u7c7b\u578b\u7528\u4e8e\u641c\u7d22\u57df\uff0c\u6bd4\u5982\u7ad9\u70b9\u641c\u7d22\u6216Google\u641c\u7d22\u3002search\u57df\u663e\u793a\u4e3a\u5e38\u89c4\u7684\u6587\u672c\u57df\u3002<\/li><\/ul>\n","protected":false},"excerpt":{"rendered":"<p>\u4ec0\u4e48\u662fHTML5 HTML5\u5c06\u6210\u4e3aHTML\u3001XHTML\u4ee5\u53caHTML DOM\u7684\u65b0\u6807\u51c6\u3002 HTML5\u662f\u5982\u4f55\u8d77\u6b65\u7684? W3C\u4e0eWHATWG\u5408\u4f5c\u7684\u7ed3\u679c\u3002W3C: World Wide Web Consorti&#46;&#46;&#46;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10],"tags":[92,90],"class_list":["post-834","post","type-post","status-publish","format-standard","hentry","category-10","tag-html5","tag-web"],"_links":{"self":[{"href":"https:\/\/blog.cauchyschwarz.com\/index.php?rest_route=\/wp\/v2\/posts\/834","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.cauchyschwarz.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.cauchyschwarz.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.cauchyschwarz.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.cauchyschwarz.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=834"}],"version-history":[{"count":1,"href":"https:\/\/blog.cauchyschwarz.com\/index.php?rest_route=\/wp\/v2\/posts\/834\/revisions"}],"predecessor-version":[{"id":835,"href":"https:\/\/blog.cauchyschwarz.com\/index.php?rest_route=\/wp\/v2\/posts\/834\/revisions\/835"}],"wp:attachment":[{"href":"https:\/\/blog.cauchyschwarz.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=834"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.cauchyschwarz.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=834"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.cauchyschwarz.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=834"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}