简化了文档声明、字符集

//声明
<!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 (一)的更多相关文章

  1. HTML5之本地文件系统API - File System API

    HTML5之本地文件系统API - File System API 新的HTML5标准给我们带来了大量的新特性和惊喜,例如,画图的画布Canvas,多媒体的audio和video等等.除了上面我们提到 ...

  2. HTML5 postMessage 和 onmessage API 具体应用

    HTML5 postMessage 和 onmessage API 具体应用 随着 HTML5 的发展.了解并熟悉 HTML5 的 API 接口是很重要的.postMessage(send) 和 on ...

  3. HTML5语音合成Speech Synthesis API简介

    by zhangxinxu from http://www.zhangxinxu.com/wordpress/?p=5865本文可全文转载,但需得到原作者书面许可,同时保留原作者和出处,摘要引流则随意 ...

  4. html5获取地理位置信息API

    html5获取地理位置信息API 在HTML5中,可以看下如何使用Geolocation API来获得用户的地理位置信息,如果该浏览器支持的话,且设备具有定位功能,就能够直接使用这组API来获取当前位 ...

  5. 使用HTML5的两个api,前端js完成图片压缩

    主要用了两个html5的 API,一个file,一个canvas,压缩主要使用cnavas做的,file是读取文件,之后把压缩好的照片放入内存,最后内存转入表单下img.src,随着表单提交. 照片是 ...

  6. HTML5关于上传API的一些使用(上)

    HTML5提供了很多有用的API,其中就包括上传的API,XMLHttpRequest2.0,在HTML5时代之前,需要进行二进制的上传一般都会才用flash的方案,但是当XMLHttpRequest ...

  7. HTML5 调用百度地图API地理定位

    <!DOCTYPE html> <html> <title>HTML5 HTML5 调用百度地图API地理定位实例</title> <head&g ...

  8. HTML5调用百度地图API进行地理定位实例

    自从HTML5的标准确定以后,越来越多的网站使用HTML5来进行开发.虽然对HTML5支持的浏览器不是很多,但是依然抵挡不了大伙对HTML5开发的热情.今天为大家带来的是使用HTML5调用百度地图AP ...

  9. 【HTML5】Web Audio API打造超炫的音乐可视化效果

    HTML5真是太多炫酷的东西了,其中Web Audio API算一个,琢磨着弄了个音乐可视化的demo,先上效果图: 项目演示:别说话,点我!  源码已经挂到github上了,有兴趣的同学也可以去st ...

  10. 大熊君学习html5系列之------History API(SPA单页应用的必备------重构完结版)

    一,开篇分析 Hi,大家好!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例, 让大家一步一步的体会" ...

随机推荐

  1. oracle undo 复杂度--oracle核心技术读书笔记四

    一. 概述 undo 保存的是旧数据.比方,你改动了一条记录将A列abc改动为def,那么undo里面保存的就是abc.目的有两个:1. 假设你的事务没有提交,可是已经将A列改动,那么别人读取这条数据 ...

  2. OpenStack 中的neutron-server启动过程

    neutron-server是neutron的核心组件之中的一个.负责直接接收外部请求,然后调用后端对应plugin进行处理. 其核心启动过程代码主要在neutron.server包中. __init ...

  3. HDU 4815 背包

    标题的含义给出N问题.和概率P,然后给予相应的分数为每个问题x(每个问题只有两种选择,纠正错误). 两个人来回答.一个人是随机选择的答案,问:还有一个人的至少一些点的能力有保证P概率不会失败. 01背 ...

  4. SE 2014年4月3日

    一  OSPF协议都支持哪些特殊区域?每种特殊区域都有什么特点. OSPF协议支持的特殊区域主要有stub区域.totally stub区域以及nssa区域,其中stub区域一般出现在末梢网络,即它的 ...

  5. 【译】ASP.NET MVC 5 教程 - 7:Edit方法和Edit视图详解

    原文:[译]ASP.NET MVC 5 教程 - 7:Edit方法和Edit视图详解 在本节中,我们继续研究生成的Edit方法和视图.但在研究之前,我们先将 release date 弄得好看一点.打 ...

  6. 京东商城招聘匹配系统资深工程师 T4级别

    岗位级别:T4 岗位职责: 1.负责匹配系统的架构设计 2.负责网页抽取.实体识别.匹配等算法设计 3.核心代码编写,代码review 任职要求: 1.熟悉机器学习.自然语言处理理论和算法2.三年以上 ...

  7. Bootstrap之表格

    基本实例 为随意<table>标签加入.table类能够为其赋予主要的样式-少量的内补(padding)和水平方向的分隔线. <table class="table&quo ...

  8. extjs在form表单提交成功、故障响应信息

    类别Ext.form.Action.Submit 处理表单Form数据并返回response类对象. 这个类的仅在形式实例Form{@link Ext.form.BasicForm#submit 提交 ...

  9. 【前端攻略】:玩转图片Base64编码(转)

    引言 图片处理在前端工作中可谓占据了很重要的一壁江山.而图片的Base64编码可能相对一些人而言比较陌生,本文不是从纯技术的角度去讨论图片的base64编码.标题略大,不过只是希望通过一些浅显的论述, ...

  10. UNIX网络编程卷1 server程序设计范式7 预先创建线程,以相互排斥锁上锁方式保护accept

    本文为senlie原创.转载请保留此地址:http://blog.csdn.net/zhengsenlie 1.预先创建一个线程池.并让每一个线程各自调用 accept 2.用相互排斥锁代替让每一个线 ...