API预览JavaScript与HTML5脚本

HTML 5是万维网核心语言的第5个主要版本,早在2004年就由网络富文本应用技术工作组(WHATWG)发起。虽然标准仍在制定之中,但有些浏览器已经能够支持一部分HTML 5的特性了,如Safari 4 beta;51CTO.com上周曾报道过《苹果抢先支持HTML5视频功能》的消息,今天我们来看看在对JavaScript的支持和替代方面,HTML5有哪些进展。

HTML 5中的脚本API

HTML5新增的特性充分地考虑了应用程序开发人员,HTML 5引入了大量的新的Javascript API。可以利用这些内容与对应的HTML元素相关联,它们包括:

◆二维绘图API,可以用在一个新的画布(Canvas)元素上以呈现图像、游戏图形或者其他运行中的可视图形。

◆一个允许web应用程序将自身注册为某个协议或MIME类型的API。

◆一个引入新的缓存机制以支持脱机web应用程序的API。

◆一个能够播放视频和音频的API,可以使用新的video和audio元素。

◆一个历史纪录API,它可以公开正在浏览的历史纪录,从而允许页面更好地支持AJAX应用程序中实现对后退功能。

◆跨文档的消息传递,它提供了一种方式,使得文档可以互相通信而不用考虑它们的来源域,在某种程度上,这样的设计是为了防止跨站点的脚本攻击。

◆一个支持拖放操作的API,用它可以与draggable特性相关联。

◆一个支持编辑操作的API,用它可以与一个新的全局contenteditable特性相关联。

◆一个新的网络API,它支持web应用程序在本地网络上互相通信,并在它们的源服务器上维持双向的通信。

◆使用JavaScript API的键/值对实现客户端的持久化存储,同时支持嵌入的SQL数据库。

◆服务器发送的事件,通过它可以与新的事件源(event-source)元素关联,新的事件源元素有利于与远程数据源的持久性连接,而且极大地消除了在Web应用程序中对轮询的需求。

您可能会问,HTML5基本可以替代JavaScript了,有了HTML5,我们还需要JS吗?YUI开发团队成员Matt & Eric对此解释说:

JavaScript框架的作用是利用更丰富的API和透明的跨浏览器支持来改善编程环境。YUI将会遵循HTML5标准(特别是那些已经对浏览器产生影响的),并添加对老版本浏览器的支持,以便让新的功能可以在标准实现和推广之前就得以应用。客户端存储API是一个 例子,YUI将要实现它以消除HTML 5和现有浏览器之间的不同。

HTML、CSS和JavaScript的组合已经被证明是非常实用和通用的,每一项技术都在积极的进步,没有必要替换掉它们。就像HTML5的改进一样,都会向在各自的应用场景下不断提高和发展。

时间: 2024-09-20 22:12:57

API预览JavaScript与HTML5脚本的相关文章

JavaScript File API实现文件上传预览_javascript技巧

一.概述以往对于基于浏览器的应用而言,访问本地文件都是一件头疼的事情.虽然伴随着 Web 2.0 应用技术的不断发展,JavaScript 正在扮演越来越重要的角色,但是出于安全性的考虑,JavaScript 一直是无法访问本地文件的.于是,为了在浏览器中能够实现诸如拖拽并上传本地文件这样的功能,我们就不得不求助于特定浏览器所提供的各种技术了.比如对于 IE,我们需要通过 ActiveX 控件来获取对本地文件的访问能力,而对于 Firefox,同样也要借助插件开发.由于不同浏览器的技术实现不尽相

JavaScript File API文件上传预览_javascript技巧

对于基于浏览器的应用而言,访问本地文件都是一件头疼的事情,通常我们能做的仅仅是使用<input type="file">标签来上传文件.实现过程是:选取文件的时候value 属性保存了用户指定的文件的名称,表单被提交的时候,浏览器会向服务器发送选中的文件的内容而不仅仅是发送文件名.再获取服务器返回的地址,然后做预览. 但是如果有一天我们要上传一个图片,传了图片后预览想换另一张图片,就又得先上传到服务器再预览.在网络比较慢的情况下,这样真的很折腾. 所以我们某些时候需要先预览

基于HTML5的可预览多图片Ajax上传_AJAX相关

一.关于图片上传什么什么的 在XHTML的时代,我们使用HTML file控件上传图片一次只能上传一张.要一次上传多图,做法是借助于flash.例如swfupload.js.可惜,使用复杂的点,比如flash文件需与页面同父文件夹,JavaScript文件大小也很可观. 我之前曾翻译编辑过一篇"Ajax Upload多文件上传插件"的文章,此插件的亮点是使用隐藏的iframe框架页面模拟ajax上传,但是,实际上,还是一次只能上传1张图片,可以多次上传而已. HTML5是个好东东,其中

js 上传文件预览的简单实例_javascript技巧

1. FILE API html5提供了FIle和FileReader两个方法,可以读取文件信息并读取文件. 2. example <html> <body> <div id="test-image-preview" style="border: 1px solid rgb(204, 204, 204); width: 100%; height: 200px; background-size: contain; background-repeat

JS实现的图片预览插件与用法示例【不上传图片】_javascript技巧

本文实例讲述了JS实现不需要上传的图片预览插件与用法.分享给大家供大家参考,具体如下: 小小的几十行代码,很牛逼,很实用. 支持多个图片的预览,只要new多个对象就行了. html如下 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns

js实现纯前端的图片预览_javascript技巧

图片上传是一个普通不过的功能,而图片预览就是就是上传功能中必不可少的子功能了.在这之前,我曾经通过订阅input[type=file]元素的onchange事件,一旦更改路径则将图片上传至服务器,接着就获取图片路径并赋值到img元素上.先不管文件异步提交的解决方案,就是服务端清理那些临时的预览图片已经增加不少工作量了. 偶然从MDN上找到纯前端图片预览的相关资料,经过整理后记录下来以便日后查阅.  一.准备功夫1──FileReader   FileReader是HTML5的新特性,用于读取Bl

多种方式实现js图片预览_javascript技巧

先贴代码,之后完善: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta n

如何通过js实现图片预览功能【附实例代码】_javascript技巧

实现代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Co

input file上传 图片预览功能实例代码_javascript技巧

input file上传图片预览其实很简单,只是没做过的感觉很神奇,今天我就扒下她神秘的面纱,其实原理真的很简单,下面通过一段代码大家都明白了. 具体代码如下所示: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script src="jquery.js"></script>