- 浏览: 86806 次
- 性别:
- 来自: 苏州
最新评论
-
liang3307:
好,我们也在使用html5,其中为了离线可以完全访问,把服务端 ...
HTML5 本地数据库
文章列表
离线Web应用程序介绍
在HTML5中新增了一个API,为离线Web应用程序的开发提供了可能性。为了让Web应用程序在离线状态时也能正常工作,就必须要把所有构成Web应用程序的资源文件,诸如:HTML文件、CSS文件、JavaScript脚本文件等放在本地缓存中,当服务器没有和Internet建立连接的时候,也可以利用本地缓存中的资源文件来正常运行Web应用程序。
本地缓存与浏览器网页缓存的区别
首先,本地缓存是为整个Web应用程序服务的,而浏览器的网页缓存只服务于单个网页,任何网页都具有网页缓存,而本地缓存只缓存那些指定缓存的网页。
其次,网页缓存也是不安全、不可靠的,因为我们不知道在 ...
本地数据库的基本概念
在HTML5中,添加了很多功能来将原本必须要保存在服务器上的数据转为保存在客户端本地,从而提高了Web应用程序的性能,减轻了服务器端的负担。在这其中,一项非常重要的功能就是数据库的本地存储功 ...
Web Storage简单使用
在HTML5中重新提供了一种在客户端本地保存数据的功能,它就是Web Storage功能。Web Storage功能,就是在Web上存储数据的功能。具体来说,又分为两种:
sessionStorage:将数据保存在session对象中。所谓session,是指用户在浏览某个网站时,从进入网站到浏览器关闭所经过的这段时间,也就是用户浏览这个网站所花费的时间。session对象可以用来保存在这段时间内所要求保存的任何数据。
localStorage:将数据保存在客户端本地的硬件设备(通常指硬盘,但也可以是其他硬件设备)中,即使浏览器被关闭了,该数据仍然存在,下 ...
video元素和audio元素的方法
play()方法:使用该方法来播放媒体,自动将元素的paused属性值设置为false。
pause()方法:使用该方法来暂停播放,自动将元素的paused属性值设置为true。
load()方法:使用该方法来重新载入媒体进行播放,自动将元素的playbackRate属性值变为defaultPlaybackRate属性的值,自动将元素的error的值变为null。
canPlayType()方法:使用该方法来测试浏览器是否支持指定的媒体类型,该方法定义如下:
var support = mediaElement.canPlayType(typ ...
音频和视频元素的属性
这两种元素所具有的属性大致相同,介绍如下:
src属性和autoplay属性
src属性用于指定媒体数据的URL地址。
autoplay属性用于指定媒体是否在页面加载后是否自动播放,使用方法如下:
<video src="sample.mov" autoplay="autoplay"></video>
perload属性
该属性用于指定视频或音频数据是否预加载。如果使用预加载,则浏览器会预先将视频或音频数据进行缓冲,这样可以加快播放速度,因为播放时数据已经预先缓冲完毕。该属性有三个可选值,分别是“ ...
video与audio元素基础
在HTML5中,video元素专门用来播放网络上的视频或电影,而audio元素专门用来播放网络上的音频数据。
以audio元素为例,只要把播放音频的URL给指定元素的src属性就可以了,例如:
<audio src="demo/test.mp3">
您的浏览器不支持audio元素!
</audio>
通过这种方法,可以把指定的音频数据直接嵌入在网页上,其中“您的浏览器不支持audio元素!”为在不支持audio元素的浏览器中所显示的替代文字。
video元素的使用方法也很简单,只要设定好元素的长、 ...
影响事件传播
除了将Event实例最常用的属性标准化以外,jQuery还提供标准方法用于影响事件传播方面,带来同样的好处。
stopPropagation()方法将防止事件沿着DOM树向上传播,而preventDefault()方法将取消可能引起任何语义操作的示例 ...
在HTML5中,已经支持在浏览器与其他应用程序之间的数据互相拖动,同时也大大简化了有关于拖放方面的代码。
实现拖放的步骤
在HTML5中要想实现拖放操作,至少要经过两个步骤:
将想要拖放的对象元素的draggable属性设为true(draggable="true")。这样才能将该元素进行拖放。另外,img元素和a元素(必须指定href属性)默认允许拖放。
编写与拖放有关的事件处理代码。关于拖放存在的几个事件如下所示。
拖放的相关事件
事件
产生事件的元素
描述
dragstart
被拖放的元素。
开始拖放操作。
dra ...
在HTML5中,提供了一个关于文件操作的文件API,通过使用这个接口,对于从Web页面上访问本地文件系统的相关处理将会变得十分简单。
FileList对象与file对象
FileList对象表示用户选择的文件列表。在HTML5中,通过在file控件中添加multiple属性,可以使用控件内一次放置多个文件。控件内的每一个用户选择的文件都是一个file对象,而FileList对象则为这些file对象的列表,代表用户选择的所有文件。file对象具有两个属性:name属性表示文件夹名(不包含路径);lastModifiedDate属性表示文件的最后修改日期。
Blob对象
Blob表示二进制原 ...
在DWR中,engine.js是用来转换动态生成接口的JavaScript函数,它是DWR的工作引擎,所以一个引用DWR应用的页面都要使用它。
<c:set var="base">
${pageContext.request.scheme}://
${pageContext.request.serverName}:${pageContext.request.serverPort}
${pageContext.servletContext.contextPath}
</c:set>
<script type="text/jav ...
DWR根据dwr.xml配置文件或注解中的信息来生成和Java代码类似的JavaScript代码。DWR调用Java代码是同步的,但是创建与Java代码匹配的Ajax远程调用接口需要实现Ajax的异步调用特性,所以DWR通过引入回调函数来解决此问题,当结果被返回 ...
反向Ajax的基本概念是客户端不必从服务器获取信息,服务器会把相关信息直接推送到客户端。这样做的目的是解决Ajax传统Web模型所带来的一个限制,即实时信息很难从技术上解决。原因是,客户端必须联系服务器,主动询问是 ...
编辑Java类
package org.lucifer.dwr;
import org.directwebremoting.annotations.Param;
import org.directwebremoting.annotations.RemoteMethod;
import org.directwebremoting.annotations.RemoteProxy;
import org.directwebremoting.annotations.ScriptScope;
import org.directwebremoting.create.NewCreator;
...
新增的figure元素与figcaption元素
figure元素是一种元素的组合,带有可选标题。figure元素用来表示网页上一块独立的内容,将其从网页上移除后不会对网页上的其他内容产生任何影响。figure元素所表示的内容可以是图片、统计图或代码示例。
figcaption元素表示figure元素的标题,它从属于figure元素,必须书写在figure元素内部,可以书写在figure元素内的其他从属元素的前面或后面。一个figure元素内最多只允许放置一个figcaption元素,但允许放置多个其他元素。
例1:不带标题的figure元素示例
<figure>
...
jQuery的事件实现,称为jQuery事件模型,它展示如下功能:
提供建立事件处理程序的统一方法;
允许在每个元素上为每个事件类型建立多个处理程序;
采用标准的事件类型名称,例如:click、mouseover等;
使Event实例可用作处理程序的参数;
对Event实例的最常用的属性进行规范化;
为取消事件和阻塞默认操作提供统一方法。
利用jQuery绑定事件处理程序
语法:bind(eventType, data, listener)
功能:在匹配集的所有元素上建立函数,作为指定事件类型的事件处理程序。
参数 eventType:(字符串)为将要建立的处理程序指定事 ...