摘要：
一、认识window.historywindow.history表示window对象的历史记录，是由用户主动产生，并且接受javascript脚本控制的全局对象。window对象通过history对象提供对览器历史记录的访问能力。它暴露了一些非常有用的方法和属性，让你在历史记录中自由前进和后退。1、历史记录的前进和后退在历史记录中后退，可以这么做：1 window.history.back();这就像用户点击浏览器的后退按钮一样。类似的，你可以前进，就像在浏览器中点击前进按钮，像这样：1 window.history.forward();2、移动到指定历史记录点通过指定一个相对于当前页面位置的 阅读全文
随笔分类 - HTML5与CSS3
LocalStorage漏洞分析
2014-01-13 19:15 by sniper007, 818 阅读, 收藏, 编辑
摘要：
之前LocalStorage爆出过一个漏洞，使用Chrome打开这个网站：http://filldisk.com，会将磁盘空间给撑爆，而且Chrome还会Crash。除了FireFox之外，其他浏览器无一例外中招。以下分析一下这个网站所使用的这个漏洞。其实这个漏洞的作者在他的博客中也做了详细的说明了，想了解的可以看这里：http://feross.org/fill-disk/规范（http://www.w3.org/TR/webstorage/#disk-space）里面对于磁盘空间的控制有这样的声明：[plain]view plaincopyUseragentsshouldlimitthet 阅读全文
【HTML5】HTML5 WebSocket简介以及简单示例
2013-10-08 18:28 by sniper007, 10950 阅读, 收藏, 编辑
摘要：
互联网发展到现在，早已超越了原始的初衷，人类从来没有像现在这样依赖过他；也正是这种依赖，促进了互联网技术的飞速发展。而终端设备的创新与发展，更加速了互联网的进化；HTTP/1.1规范发布于1999年，同年12月24日，HTML4.01规范发布；尽管已到2012年，但HTML4.01仍是主流；虽然 HTML5的草案已出现了好几个年头，但转正日期，遥遥无期，少则三五年，多则数十年；而HTML5的客户代理(对于一般用户而言，就是浏览器)，则已百 家争鸣，星星向荣；再加上移动终端的飞速发展，在大多数情况下，我们都可以保证拥有一个HTML5的运行环境，所以，我们来分享一下HTML5中的 WebSocke 阅读全文
【HTML5】使用 JavaScript 来获取电池状态（Battery Status API）
2013-10-08 15:22 by sniper007, 3003 阅读, 收藏, 编辑
摘要：
HTML5 规范已经越来越成熟，可以让你访问更多来自设备的信息，其中包括最近提交的 "Battery Status API"。如其名称所示，该 API 允许你通过 JavaScript 来获取电池的状态。因此通过使用这个 API 来判断当前正在使用电池供电，可避免运行一些重量级的 JavaScript 动画，提醒用户注意保存数据。如果你希望测试这个 API，这里有一个实际的例子。注意这个例子中电池剩余时间在我打开网页时是不可用的，几分钟后才正常显示。我在最新的 Beta 版的 Mozilla 浏览器进行测试，目前还不支持Mac ，但可以在Windows、Android 和i 阅读全文
【html5】hashchange Event – 监测URL的hash变化
2013-09-05 17:31 by sniper007, 1858 阅读, 收藏, 编辑
摘要：
通过URL传值，在?后附加以=连接的键值对，各键值对间以&连接；也可以通过URL传递页面参数，在”#”后附加的方式。两者最大的一个 区别在于：后者不会发起请求，不会导致页面刷新。常见应用场景在于：不需要请求服务器，由浏览器端脚本直接定位到某个条件下的页面展示。例如：在这个页面 中http://www.istartedsomething.com/bingimages/#20101106-us，带hash值打开的是展示某个 大图的页面，不带hash值打开(http://www.istartedsomething.com/bingimages/)的只是一个日历的图片集 界面，需要再次点击才能 阅读全文
【html】META http-equiv 大全
2013-08-14 20:05 by sniper007, 563 阅读, 收藏, 编辑
摘要：
meta是html语言head区的一个辅助性标签。几乎所有的网页里，我们可以看到类似下面这段的html代码：＜head＞＜meta http-equiv="content-Type" content="text/html; charset=gb2312"＞＜/head＞ 也许你认为这些代码可有可无。其实如果你能够用好meta标签，会给你带来意想不到的效果，例如加入关键字会自动被大型搜索网站自动搜集；可以设定页面格式及刷新等等。 一、meta标签的组成 meta标签共有两个属性，它们分别是http-equiv属性和name属性，不同的属性又有不同的参数值， 阅读全文
【html5】【canvas】drawImage图片会变形
2013-04-18 16:09 by sniper007, 2106 阅读, 收藏, 编辑
摘要：
canvas的实际宽高（canvas代码种实际参考的大小）要这样设置否则默认是300－150样式里面的宽高代表渲染大小实际宽高和样式宽高不一致就会拉伸了 阅读全文
【html】(X)HTML语义与元素名全称（部分）【转】
2013-01-04 16:20 by sniper007, 195 阅读, 收藏, 编辑
摘要：
你思考过每个元素名的全称问题吗？也许出于习惯，很少想这个问题，例如，p表示段落，那么p的本意是什么呢？它是什么词的缩写呢？也许你知道p是段落（paragraph）的缩写，那么其他元素的名称呢？今天琢磨这个问题，故在网上狂找了半天，但是很遗憾居然没有找到相关资料，偶尔看到几个零散的提示，但是没有系统研究的资料，大家都在谈论HTML的语义性，但是连最基本的元素的原义是什么都没有搞清，何谈语义化。故下点功夫整理一下，最后汇集一个HTML元素名全称的原义表，仅作为参考，可能还很不全面，或者理解偏差，请有识之士PP。div语义：Division（分隔）span语义：Span（范围）ol 语义：Orde. 阅读全文
【HTML5】【转】浏览器本地数据（sessionStorage、localStorage、cookie）与server端数据
2012-10-30 14:37 by sniper007, 1570 阅读, 收藏, 编辑
摘要：
sessionStorage 和 localStorage 是HTML5 WebStorage API 提供的，可以方便的在web请求之间保存数据。有了本地数据，就可以避免数据在浏览器和服务器间不必要地来回传递。sessionStorage、 localStorage、cookie都是在浏览器端存储的数据，其中sessionStorage的概念很特别，引入了一个“浏览器窗口”的概念。 sessionStorage是在同源的同窗口（或tab）中，始终存在的数据。也就是说只要这个浏览器窗口没有关闭，即使刷新页面或进入同源另一页面， 数据仍然存在。关闭窗口后，sessionStorage即被销毁。同 阅读全文
【html5】Web Storage全解析
2012-10-30 14:36 by sniper007, 201 阅读, 收藏, 编辑
摘要：
Web应用的发展，使得客户端存储使用得也越来越多，而实现客户端存储的方式则是多种多样。最简单而且兼容性最佳的方案是Cookie，但是作为真正的客户端存储，Cookie则存在很多致命伤。此外，在IE6及以上版本中还可以使用userData Behavior、在Firefox下可以使用globalStorage、在有Flash插件的环境中可以使用Flash Local Storage，但是这几种方式都存在兼容性方面的局限性，因此真正使用起来并不理想。针对以上情况，HTML5中给出了更加理想的解决方案：假如你需要存储复杂的数据则可以使用Web Database，可以像客户端程序一样使用SQL（不过W 阅读全文
【HTML5】'data-'属性的作用是什么?
2012-10-30 14:28 by sniper007, 2228 阅读, 收藏, 编辑
摘要：
Resig在2008年在其博客中介绍过HTML5的data-属性，现如今HTML5在如火如荼地推广，似乎国内的技术有些延迟，这篇博文可以在这里找到。data-为前端开发者提供自定义的属性，这些属性集可以通过对象的dataset属性获取，不支持该属性的浏览器可以通过 getAttribute方法获取。ppk提到过使用rel属性，lightbox库推广了rel属性，HTML5提供了data-做替代，这样可以更好 地使用自定义的属性。<divdata-author="david"data-time="2011-06-20"data-comment-num 阅读全文