一、优势
1、标签的改变：<header>，<footer>，<dialog>，<aside>，<figure>，<section>等；
2、代码简洁，开发游戏，移动开发工具；
3、标准未定，浏览器兼容性问题。

二、svg和canvas
1、svg
svg可以单独作为文件打开，在AI里做矢量图形，保存图层路径，即可另存为Svg文件。
path语法：命令+参数。大写字母表示坐标参数为绝对位置，小写字母表示坐标参数为相对位置（即上次画笔结束后的位置）。
Svg画椭圆：M200 200 A 200 100 0 0 1 300 300。初始位置，x半径，y半径，旋转角度，选弧长较短，顺时针，结束位置。

2、canvas
Canvas是基于状态，而不是基于对象画图。它提供容器，配合JS后，才能在页面展现图形。Canvas最好写行内样式，宽高不加单位。

三、自定义数据属性

<div id ="user" data-uid="2009" data-uname="camille" > </div>

1、使用getAttribute获取data-属性

var user = document.getElementById('user');

var userName = user.getAttribute('data-uname'); // userName = 'camille'

var userId = user.getAttribute('data-uid'); // userId = '2009'

2、使用setAttribute设置data-属性

user.setAttribute('data-age' , '100');

四、语义化标签

HTML5Shiv解决ie旧版本不支持h5新元素，浏览器小于IE9时会加载html5shiv.js文件。你必须将其放置于<head>元素中，让CSS样式应用在未知元素上只需执行document.createElement(elementName) 即可实现。

<!--[ifltIE9]>

  <script type="text/javascript" src="scripts/html5shiv.js"></script>

<![endif]-->

五、一些新标签

1、details，summary

可以通过html和css实现树形结构，下拉菜单，展开更多，不用js。

2、datalist

搜索下拉框。

html5那些事儿的更多相关文章

  1. WeX5与阿里内测的Weex与有何纠葛？快来看HTML5开发圈那些逗逼事儿！

    4月21日~23日,由infoQ主办的2016 Qcon大会北京站如期举行. HTML5开发已经成为移动开发/前端专题中无可争议的焦点,核心议题已经由前几年的是否该用HTML5转向了如何高性能.高效率 ...

  2. HTML5 程序设计 - 使用HTML5 Canvas API

    请你跟着本篇示例代码实现每个示例,30分钟后,你会高喊:“HTML5 Canvas?!在哥面前,那都不是事儿!” 呵呵.不要被滚动条吓到,很多都是代码和图片.我没有分开写,不过上面给大家提供了目录,方 ...

  3. setTimeout那些事儿

    一.setTimeout那些事儿之单线程 一直以来,大家都在说Javascript是单线程,浏览器无论在什么时候,都且只有一个线程在运行JavaScript程序. 但是,不知道大家有疑问没——就是我们 ...

  4. Javascript中关于cookie的那些事儿

    Javascript-cookie 什么是cookie? 指某些网站为了辨别用户身份.进行session跟踪而储存在用户本地终端上的数据(通常经过加密).简单点来说就是:浏览器缓存. cookie由什 ...

  5. CSS知识回顾--读《CSS 那些事儿》笔记

    由于之前有了解过CSS的相关知识,有了一定的基础,所以读起<CSS 那些事儿>不是很有难度,况且我现在读起来时,CSS3和HTML5比较流行,这里只是记录一些CSS知识记录,不做详细铺开, ...

  6. （转） 浅析HTML5在移动应用开发中的使用

    (转)浅析HTML5在移动应用开发中的使用 (原)http://www.iteye.com/magazines/67   2012-03-07  来自 UECD.163.com  编辑 wangguo ...

  7. [转] Android 4.4中播放HTML5视频<video>的Bug

    近期Nexus 4手机自动升级到Android4.4,本来挺好的一件事儿,结果发现自己的应用中出现一个Bug,应用中使用了Webview播放HTML5视频,代码如下: <video width= ...

  8. html5 postMessage解决跨域、跨窗口消息传递

    一些麻烦事儿 平时做web开发的时候关于消息传递,除了客户端与服务器传值还有几个经常会遇到的问题 1.页面和其打开的新窗口的数据传递 2.多窗口之间消息传递 3.页面与嵌套的iframe消息传递 4. ...

  9. HTML5在移动端开发的12大特性

    1.离线缓存为HTML5开发移动应用提供了基础 HTML5 Web Storage API可以看做是加强版的cookie,不受数据大小限制,有更好的弹性以及架构,可以将数据写入到本机的ROM中,还可以 ...

随机推荐

  1. CVE-2017-12149JBoss 反序列化漏洞利用

    CVE-2017-12149 漏洞描述 互联网爆出JBOSSApplication Server反序列化命令执行漏洞(CVE-2017-12149),远程攻击者利用漏洞可在未经任何身份验证的服务器主机 ...

  2. npm 安装 electron 超时

    由于某些不可描述的原因,俺的某个小项目要用客户端桌面应用,后台那还是 php 了.经广大的群友指导,发现了 Electron 这个项目.它可以用 html, css, javascript 构建跨平台 ...

  3. fcntl函数的用法总结

    fcntl系统调用可以用来对已打开的文件描述符进行各种控制操作以改变已打开文件的的各种属性 函数原型:   #include<unistd.h> #include<fcntl.h&g ...

  4. Nginx中worker_connections的问题

    查看日志,有一个[warn]: 3660#0: 20000 worker_connections are more than open file resource limit: 1024 !! 原来安 ...

  5. 使用pandas把mysql的数据导入MongoDB。

    使用pandas把mysql的数据导入MongoDB. 首先说下我的需求,我需要把mysql的70万条数据导入到mongodb并去重, 同时在第二列加入一个url字段,字段的值和第三列的值一样,代码如 ...

  6. Tomcat的JVM设置和连接数设置

    Windows环境下修改“%TOMCAT_HOME%\bin\catalina.bat”文件,在文件开头增加如下设置:set JAVA_OPTS=-Xms256m -Xmx512m Linux环境下修 ...

  7. linux安装python3（已有python2.x情况下）

    参考:https://www.cnblogs.com/Guido-admirers/p/6259410.html 1.官网下载python3 cd /home/download wget https: ...

  8. lumen 在AppServiceProvider 使用Illuminate\Support\Facades\Redis 报错

    这里需要注意 bootstrap/app.php中AppServiceProvider 和RedisServiceProvider 注入的先后顺序

  9. JS动态创建元素（两种方法）

    前言 创建元素有两种方法 1)将需要创建的元素,以字符串的形式拼接:找到父级元素,直接对父级元素的innnerHTML进行赋值. 2)使用Document.Element对象自带的一些函数,来实现动态 ...

  10. 经典面试题：js继承方式上

    js不是传统的面向对象语言,那么他是怎么实现继承的呢?由于js是基于原型链实现的面向对象,所以js主要通过原型链查找来实现继承,主要有两大类实现方式,分为基于构造函数的继承,以及非构造函数的继承. 由 ...