html5 新技术 - Speaker Deck

Slide 1

Slide 1 text

HTML5新技术(1) hugohua

Slide 2

Slide 2 text

data-***  符合html5规范  高级浏览器支持  js提供dataset方法  jq提供data方法  CSS提供attr() 方法

Slide 3

Slide 3 text

dataset *带连字符连接的名称在使用的时候需要命名驼峰化

Slide 4

Slide 4 text

$(‘’).data() *data方法，页面初始化时缓存数据，后续无法修改属性值。参考文献： http://www.learningjquery.com/2011/09/using-jquerys-data-apis

Slide 5

Slide 5 text

CSS attr() DEMO

Slide 6

Slide 6 text

Demo

Slide 7

Slide 7 text

datalist *扩展阅读： http://www.zhangxinxu.com/wordpress/2013/03/html5-datalist-实际应用-可行性/

Slide 8

Slide 8 text

download

Slide 9

Slide 9 text

download Download属性：表明一个资源是让用户下载的,而不是立即显示的。 Download如果存在值，则这个值是文件名。 DEMO

Slide 10

Slide 10 text

下载动态生成的文件可以通过Bob创建二进制文件，然后用这个属性下载到本地。

Slide 11

Slide 11 text

autofocus Autofocus：页面加载时自动地获得焦点。仅对 input、button、textarea等表单元素有效多个autofocus存在时，作用于最后一个 DEMO

Slide 12

Slide 12 text

placeholder 文本框默认文字提示默认颜色在各浏览器下表现不一致，建议通过CSS重置样式 DEMO