了解HTML5和“她”的 API (一)
简化了文档声明、字符集
//声明
<!doctype html>
//字符
<meta charset="utf-8">
引入了新的标签元素
Selectors API
//单个
querySelector()
//多个
querySelectorAll()
javascript日志和调试
console.log()
JSON
JSON.parse() //将JSON字符串序列化为JavaScript对象
JSON.stringify() //把JavaScript对象序列化为JSON字符串
Canvas(http://www.w3school.com.cn/tags/html_ref_canvas.asp)
<canvas></canvas>
左上角坐标为原点(x=0,y=0)
SVG (http://www.w3school.com.cn/svg/svg_reference.asp)
Audio and Video(音频和视频)
video
//判断浏览器是否支持video audio
var supportVideo = !!(document.createElement('video').canPlayType); <video src="http://www.w3school.com.cn/i/movie.ogg" controls="controls">
你的浏览器不支持html5 video
</video>
audio
<audio controls="controls">
<source src="http://www.w3school.com.cn//i/song.ogg" type="audio/ogg">
<source src="http://www.w3school.com.cn//i/song.mp3" type="audio/mpeg">
你的浏览器不支持html5 audio
</audio>
Geolocation(地理定位)
if(navigator.geolocation){
console.log('支持地理定位');
}else{
console.log('不支持地理定位');
}
//使用 getCurrentPosition() 方法来获取位置
navigator.geolocation.getCurrentPosition(updateLocation); //一次获取
//navigator.geolocation.watchPosition(updateLocation); //多次获取
function updateLocation(position){
var latitude = position.coords.latitude,
longitude = position.coords.longitude;
console.log('纬度:'+ latitude + '经度:' + longitude)
}
了解HTML5和“她”的 API (一)的更多相关文章
- HTML5之本地文件系统API - File System API
HTML5之本地文件系统API - File System API 新的HTML5标准给我们带来了大量的新特性和惊喜,例如,画图的画布Canvas,多媒体的audio和video等等.除了上面我们提到 ...
- HTML5 postMessage 和 onmessage API 具体应用
HTML5 postMessage 和 onmessage API 具体应用 随着 HTML5 的发展.了解并熟悉 HTML5 的 API 接口是很重要的.postMessage(send) 和 on ...
- HTML5语音合成Speech Synthesis API简介
by zhangxinxu from http://www.zhangxinxu.com/wordpress/?p=5865本文可全文转载,但需得到原作者书面许可,同时保留原作者和出处,摘要引流则随意 ...
- html5获取地理位置信息API
html5获取地理位置信息API 在HTML5中,可以看下如何使用Geolocation API来获得用户的地理位置信息,如果该浏览器支持的话,且设备具有定位功能,就能够直接使用这组API来获取当前位 ...
- 使用HTML5的两个api，前端js完成图片压缩
主要用了两个html5的 API,一个file,一个canvas,压缩主要使用cnavas做的,file是读取文件,之后把压缩好的照片放入内存,最后内存转入表单下img.src,随着表单提交. 照片是 ...
- HTML5关于上传API的一些使用（上）
HTML5提供了很多有用的API,其中就包括上传的API,XMLHttpRequest2.0,在HTML5时代之前,需要进行二进制的上传一般都会才用flash的方案,但是当XMLHttpRequest ...
- HTML5 调用百度地图API地理定位
<!DOCTYPE html> <html> <title>HTML5 HTML5 调用百度地图API地理定位实例</title> <head&g ...
- HTML5调用百度地图API进行地理定位实例
自从HTML5的标准确定以后,越来越多的网站使用HTML5来进行开发.虽然对HTML5支持的浏览器不是很多,但是依然抵挡不了大伙对HTML5开发的热情.今天为大家带来的是使用HTML5调用百度地图AP ...
- 【HTML5】Web Audio API打造超炫的音乐可视化效果
HTML5真是太多炫酷的东西了,其中Web Audio API算一个,琢磨着弄了个音乐可视化的demo,先上效果图: 项目演示:别说话,点我! 源码已经挂到github上了,有兴趣的同学也可以去st ...
- 大熊君学习html5系列之------History API（SPA单页应用的必备------重构完结版）
一,开篇分析 Hi,大家好!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例, 让大家一步一步的体会" ...
随机推荐
- HDU 4022 Bombing （map + multiset）
题意: 在x,y坐标范围为10 ^ -9 ~~ 10 ^ 9的坐标轴之中,有 10W个点(注意有些点可能在同一坐标上),然后有10W个询问,处理询问按照输入顺序处理,对于每个询问a,b a == ...
- Codeforces 196 C. Paint Tree
分治.选最左上的点分给根.剩下的极角排序后递归 C. Paint Tree time limit per test 2 seconds memory limit per test 256 megaby ...
- poj2236（并查集）
题目连接 题意:一张图上分布着n台坏了的电脑,并知道它们的坐标.两台修好的电脑如果距离<=d就可以联网,也可以通过其他修好的电脑间接相连.给出操作“O x”表示修好x,给出操作“S x y”,请 ...
- php获取分类以下的全部子类方法
获取分类以下的全部子类方法: static function getMenuTree($arrCat, $parent_id = 0, $level = 0,$all=True) { static $ ...
- MyReport演示下载连接和相关文章索引
演示地址 Flex集成方式 (旧版2.6) HTML集成方式 MyReport产品站点 NEW 相关文章 ------------------------2.6下面版本号--------------- ...
- 伪教练技术培训之殇-2013年9月江西IDC拓行榜与综述
纠集几个人,然后培训所谓的教练技术培训. 培训的人一期又一期的参与,国学.佛学.超能量,无所不用其极,然后就是疯狂的拿人头,邀请朋友加盟. 有甚者还披上“科技”的外衣,用“水知道答案”这种早被公知指出 ...
- Android-Universal-Image-Loader学习笔记（一个）
Android-Universal-Image-Loader它是一个开源项目,处理图像加载和缓存.闲暇的时候,读一些源.特别记录. 所述图像文件(磁盘)高速缓存,我们需要考虑的因素,如以下 1) 定 ...
- 数据库的group by 分组
有一个表 查询结果为 用下面的代码写 select COUNT( case NumName when 'a' then NumName end ) as 'aaa', COUNT( case NumN ...
- OCP读书笔记(20) - 复制数据库
没有连接到target的复制 将orcl数据库的备份复制为orcl1 一.创建orcl的备份: run{ backup database plus archivelog;} 二.复制数据库为orcl1 ...
- PHP计算中文字符串长度 、截取相应中文字符串
PHP计算字符串长度 及其 截取相应中文字符串 计算字符长度: $gouWu = '美日汇http://www.hnzyxok.com/'; echo mb_strlen($gouWu,' ...