Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

html5 新技术

Avatar for hugo hugo
November 27, 2013
Programming
190
3

html5 新技术

主要介绍了html的一些新增属性和api

Avatar for hugo

hugo

November 27, 2013

More Decks by hugo

See All by hugo
CSS命名及书写规范
Avatar for hugo baofen14787
0
700
移动端性能调优及16ms优化
Avatar for hugo baofen14787
1
2.4k
html5 新技术 2
Avatar for hugo baofen14787
1
150
html5 新技术 3
Avatar for hugo baofen14787
1
120

Other Decks in Programming

See All in Programming
スマート反転とウェブアクセシビリティ
Avatar for KAMIHARA Takumi camiha
0
210
市販E-Readerを乗っ取れ 〜Embedded Swiftで電子ペーパーガジェットを制御する〜
Avatar for Trickart trickart
0
190
FreeBSDでZabbixを動かす
Avatar for kenkino kenkino
0
300
How I Stole PSI from Android Studio - DroidKaigi2026
Avatar for JunRong Tan worker8
0
130
Webの地図
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
6
4.6k
手動確認はもう限界 〜XCUITestでCustom URL Schemeの遷移を起動種別ごとに自動テストする〜 / Testing Custom URL Schemes with XCUITest
Avatar for otouto otouto
0
300
【高い買い物LT会】初任給で話題の国産フィジカルAIを買った話
Avatar for 赤神青空 akagami
PRO
0
160
WebRTC映像をAirPlayに対応させる挑戦.pdf
Avatar for monolithic-adam monolithic_adam
0
270
AI × TiDD / 2026.09.05 Redmine 大阪
Avatar for tokudiro tokudiro
1
170
AIは賢い。でも実行環境は？ CLIおじさんがAI時代に伝えたいこと ~ CLIおじさんがAI時代に伝えたいこと ~
Avatar for curekoshimizu curekoshimizu
1
240
iOSDC2026登壇資料.pdf
Avatar for RioFujimon riofujimon
0
170
世界の中心で、AI（App Intents）をさけぶ ー App Intents中心設計の実践ガイド
Avatar for touyou touyou
0
600

Featured

See All Featured
KATA
Avatar for Megan Lloyd mclloyd
PRO
35
15k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
85
9.6k
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
142
7.7k
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
50
15k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
11
1k
Agile Actions for Facilitating Distributed Teams - ADO2019
Avatar for Mark Kilby mkilby
0
280
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
Avatar for Katarina Dahlin katarinadahlin
PRO
3
3.8k
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
29
4.5k
How to Think Like a Performance Engineer
Avatar for Harry Roberts csswizardry
28
2.8k
Designing Powerful Visuals for Engaging Learning
Avatar for Mike Taylor tmiket
1
550
Applied NLP in the Age of Generative AI
Avatar for Ines Montani inesmontani
PRO
4
2.5k
Documentation Writing (for coders)
Avatar for Carmen Chung carmenintech
77
5.5k

Transcript

  1. HTML5新技术(1) hugohua

  2. data-***  符合html5规范  高级浏览器支持  js提供dataset方法  jq提供data方法 

    CSS提供attr() 方法

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

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

  5. CSS attr() DEMO

  6. Demo

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

  8. download

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

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

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

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

  13. Context Menus Chrome暂不支持 DEMO

  14. None

  15. HTML5 JS API • 未完待续 • 3Q