2017年04月_iteye_5722

Docker简介和学习Docker资源

一容器简介Docker是一个开源的应用容器引擎，基于Go语言，并遵从Apache2.0协议开源。Docker可以让开发者打包他们的应用以及依赖包到一个轻量级、可移植的容器中，然后发布到任何流行的 Linux 机器上，也可以实现虚拟化。容器是完全使用沙箱机制，相互之间不会有任何接口（类似 iPhone 的 app）,更重要的是容器性能开销极低。二 Docker的应用场景...

2017-04-30 09:16:55 182

CentOS下Docker 安装

一安装Docker前提条件目前，CentOS仅发行版本中的内核支持Docker。Docker运行在CentOS 7上，要求系统为64位、系统内核版本为 3.10 以上。二查看CentOS环境信息[root@localhost ~]# uname -r3.10.0-327.36.3.el7.x86_64[root@localhost ~]# 三安装Do...

2017-04-30 09:14:24 224

使用WebSocket进行通信的简单应用

一应用打开一个页面，将向服务器发送一段字符串，并通过onmessage事件监听器来接受服务器返回的消息。二代码客户端代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <me

2017-04-29 08:02:34 176

使用WebSocket实现多人实时聊天

一应用本应用使用WebSocket实现多人实时聊天二代码客户端代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta http-equiv="Content

2017-04-29 08:01:12 489

跨文档发送JSON消息实现图书选择

一应用该实例允许用户打开一个页面来选择图书，当用户选择了合适的图书之后，再把用户选择的图书传回主页面。该应用是用JSON消息发送的。二代码1、viewBook.html<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(Craz...

2017-04-28 18:54:03 163

HTML5 WebSocket简介

HTML5 WebSocketWebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。在WebSocket API中，浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求，连接建立以后，客户端和服务器端就可以...

2017-04-28 18:51:11 165

跨文档消息传递应用

一应用source.html程序调用window的open方法打开一个新的窗口，接下来程序即可调用新窗口对应的window对象的postMessage向该文档发送消息。二代码1、source.html<!DOCTYPE html><html><head> <meta name="author" con...

2017-04-27 21:11:03 161

Worker子线程之间的数据交换应用

一应用1、第一条Worker线程负责收集指定范围内的质数。2、第二条Worker线程负责从指定范围的质数中随机抽取指定数量的质量。二代码1、calPrime.html<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(Cra...

2017-04-27 21:08:06 203

与Web Worker线程交换数据应用

一应用该应用允许用户输入两个数，两个数确定一个范围，而程序代码则计算、收集这个范围的所有质数。二代码1、HTML代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta

2017-04-26 19:20:27 186

嵌套Worker线程应用

一应用1、前台JS脚本先启动一个Worker线程，该Worker线程负责收集该范围内的所有质数。2、程序把收集到的所有质数再次提交给另外一个Worker线程统计出指定的质数。二代码1、calPrime.html<!DOCTYPE html><html><head><metaname="author"cont...

2017-04-26 19:13:21 194

使用Web Worker创建多线程应用

一介绍HTML5 Web Workersweb worker是运行在后台的JavaScript，不会影响页面的性能。什么是 Web Worker当在HTML页面中执行脚本时，页面的状态是不可响应的，直到脚本已完成。web worker是运行在后台的JavaScript，独立于其他脚本，不会影响页面的性能。您可以继续做任何愿意做的事情：点击、选取内容等等，而此时web w...

2017-04-24 20:26:14 186

判断浏览器在线状态

一介绍为了判断浏览器的在线状态，HTML 5提供了两种方法来检测是否在线。1、navigator.onLine属性：该属性可返回当前是否在线。如果返回true，则表示在线，如果返回false，则表示离线。当网络状态发生变化时，该值也会随之变化。2、online/offline事件：如果开发者需要在网络状态发生变化时立刻得到通知，则可以通过HTML 5的online/offline事...

2017-04-24 20:23:17 194

构建web离线应用

一构建步骤1、搭建web服务器2、给<Html>元素增加manifest属性3、编辑manifest文件。二代码核心代码：1、HTML文件（index.html）<!DOCTYPE html><htmlmanifest="index.manifest"><head><metaname="...

2017-04-23 08:59:58 183

Web Storage结构化存储实现更复杂的本地留言板

一介绍Web Storage结构化存储的实现步骤如下：1、存储结构化数据1.1:把结构数据封装在JSON对象中。1.2:把JSON对象转换为字符串后再进行保存。2、读取结构化数据2.1:读取JSON格式的字符串。2.2:通过JSON对象的属性来提取。二代码<!DOCTYPE html><html><head&...

2017-04-23 08:57:39 169

基于Web Storage的客户端留言板

一代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta http-equiv="Content-Type" content="text/html; chars

2017-04-22 19:35:45 224 1

HTML5的Web存储应用

一介绍HTML5 web存储,一个比cookie更好的本地存储方式。1、什么是HTML5 Web存储使用HTML5可以在本地存储用户的浏览数据。早些时候,本地存储使用的是cookie。但是Web存储需要更加的安全与快速，这些数据不会被保存在服务器上，但是这些数据只用于用户请求网站数据上，它也可以存储大量的数据，而不影响网站的性能。数据以键/值对存在, web网页的数...

2017-04-22 19:33:14 122

DOM取消事件默认行为应用

一介绍DOM提供了preventDefault方法来取消事件对象的默认行为。二代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta http-equiv="C

2017-04-21 19:39:07 131

原创跨浏览器拖动HTML元素

一代码HTML代码：<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta http-equiv="Content-Type" content="text

2017-04-21 19:34:36 134

DOM模型转发事件应用

一介绍DOM提供了dispatchEvent方法用于事件的转发，该方法属于Node对象，因此DOM的每个Node都可以调用该方法，从而将事件直接转发到本节点。二代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt....

2017-04-21 19:32:30 105

DOM模型事件传播机制应用

一介绍DOM模型事件传播先后沿着两个方向传播：在第一阶段，也就是事件捕获阶段，事件从最顶层的对象依次向下传播，因此先触发顶层对象的事件处理函数，然后依次向下，直到传播到事件所发生的最底层对象；接着进入第二阶段，也就是事件冒泡阶段，事件传播一直向上溯，直到最顶层对象。DOM模型事件传播机制模型如下图 DOM为Event对象提供了stoppropagation（）方法，该方法能...

2017-04-20 21:44:27 237

跨浏览器访问事件的方法

一介绍1、DOM事件模型和IE事件模型访问事件对象的方式完全不同，因此需要写一个跨浏览器的程序。2、实现跨浏览器的通常做法是：将事件处理函数绑定到DOM对象的属性上。二代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(Cr...

2017-04-20 21:42:15 142

DOM绑定事件处理器

一介绍DOM提供了一种事件绑定机制，它提供的事件绑定方法是addEventListener(event, function, useCapture)，该方法三个参数event：必需。描述事件名称的字符串。注意：不要使用 "on" 前缀。例如，使用 "click" 来取代 "onclick"。function:必需。描述了事件触发后执行的函数。当事件触发时，事件对象会作为第一个参数传...

2017-04-19 18:58:57 124

IE浏览器的事件冒泡机制

一介绍1、当浏览者在页面上执行了某个动作，页面上实际上有多个元素可以响应该事件，假如单机页面的某个按钮，该按钮又处于<div>元素之内，则实际上用户既单机了该按钮，也单击了<div>元素。2、IE中的事件传递方向是从事件发生的对象开始，然后依次向该对象所在的父节点传递。这种传递方式是从下向上传递的，因此这种事件的传递机制又称为冒泡。3、下面应用说明了这种机制...

2017-04-19 18:14:02 301

绑定DOM对象属性来触发事件处理函数

一介绍在处理Javascript的监听事件处理函数时，常用到两种方式：1、通过绑定HTML元素的属性2、通过绑定DOM对象属性本篇介绍第2种方式来进行监听事件处理二代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Le...

2017-04-18 20:56:22 370

分析浏览器的时间性能

一介绍HTML5为window对象新增了performance属性，也就是新增了一个全局可用的performance对象，就像document、navigator等对象一样，通过该对象可以对浏览器进行相关分析。二代码<!DOCTYPE html><html><head> <meta name="author" con...

2017-04-18 20:56:16 112

动态页面

一介绍借助document对象的open和write方法，可以动态生成一个页面。二代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta http-equiv=&quot

2017-04-17 21:04:02 148

Javascript中的Cookie应用

一什么是 CookieCookie 是一些数据, 存储于你电脑上的文本文件中。当 web 服务器向浏览器发送 web 页面时，在连接关闭后，服务端不会记录用户的信息。Cookie 的作用就是用于解决 "如何记录客户端的用户信息":当用户访问 web 页面时，他的名字可以记录在 cookie 中。在用户下一次访问该页面时，可以在 cookie 中读取用户访问记录。Cook...

2017-04-17 21:01:49 205

使用navigator对象的geolocation获取地理位置

一介绍HTML5为navigator新增了一个geolocation属性，这个属性是一个Geolocation对象，通过该对象获取浏览者的地理位置。下面应用示范了geolocation的用法。二代码<script type="text/javascript"> var geoHandler = function(position) { ...

2017-04-16 09:41:13 463

DHTML模型的navigator对象

一介绍window对象有一个navigator属性，它属于Navigator对象，该对象代表浏览该页面所使用的浏览器。下面应用示范了navigator对象的常用属性。二代码<script type="text/javascript"> alert(window.navigator); var browser = "当前的浏览器信息是:\n";...

2017-04-16 09:36:42 120

DHTML模型的screen对象

一介绍window对象有一个screen属性，它返回当前浏览者的屏幕对象，可用于获取用户屏幕当前大小、色深、屏幕分辨率等参数。下面应用示范了screen对象的常用属性。二代码<script type="text/javascript"> alert(window.screen); var str = "当前的屏幕信息是:\n"; // 遍历s...

2017-04-15 09:48:19 102

DHTML模型的location对象

一介绍window对象包含一个location属性，该属性可用于访问该窗口或Frame所装载文档的地址。下面应用示范了location对象的常用属性。二代码<script type="text/javascript"> var loc = window.location; var locStr = "当前的location信息是:\n"; /...

2017-04-15 09:41:10 108

DHTML模型的window对象

一介绍window对象是整个JavaScirpt脚本运行的顶层对象。在定义一个全局变量时，该变量是作为window对象的一个属性存在的。二代码<script type="text/javascript"> // 定义全局变量a var a = 5; // 判断window对象的属性a和全局变量a是否相等 alert(window.a ==...

2017-04-14 19:42:20 147

传统的DHTML模型

一 DHTML对象模型包含关系图在下图中，window对象是整个对象模型的顶层对象，该对象包含document属性，该属性代表该窗口内的HTML文档，如果该窗口内有多个Frame，则可以使用frames[]方法依次访问该窗口的每个Frame。document对象代表HTML文档本身，document对象又包含一系列的属性：forms、anchors、links、images......这...

2017-04-14 19:35:50 184

利用DOM节点关系访问HTML元素

一介绍一旦获取了某个元素，由于元素实际与DOM树的某个节点对应，因此我们完全可以利用节点之间的父子关系、兄弟关系来访问HTML元素。下面应用利用节点关系访问HTML元素。二代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(...

2017-04-13 20:47:37 126

删除表格的行或单元格

一介绍删除表格的指定表格行使用HTMLTableElement对象的如下方法：deleteRow删除表格行的指定单元格使用HTMLRowElement对象的如下方法：deleteCell 二代码<!DOCTYPE html><html><head><meta name="author" content="Yeek...

2017-04-13 20:45:09 120

谷歌浏览器查看HTML文档和DOM视图的对应关系

一打开谷歌浏览器，按照下图步骤打开【开发者工具】。二观察下图，DOM模型中的各个DOM节点，与HTML文档中各个HTML元素正好一一对应。

2017-04-12 19:08:48 381

HTML5的音频和视频监听器应用

一介绍1、<audio>和<video>元素有不少监听事件，因此可以绑定这些事件的监听器。2、本应用实现<video>的ontimeupdate事件的监听器。3、通过ontimeupdate事件绑定监听器可以实时监控音频、视频的播放位置。二代码<!DOCTYPE html><html>&lt...

2017-04-12 19:04:25 192

使用JavaScript脚本控制媒体播放

一介绍1、在HTML页面中获取<audio>和<video>元素播放音频和视频之外，很多时候我们还需要JavaScript来控制这些元素的播放。2、在JavaScript中获取<audio>元素对应的对象为HTMLAudioElement的对象，<vidio>元素对应的对象为HTMLVideoElement对象。3、HTMLAudio...

2017-04-11 20:49:13 210

HTML5的video元素和audio元素兼容性

一介绍因为各浏览器对音频和视频的支持互不相同，开发者可能希望为<video>和<audio>元素指定多个媒体源，此时可以借助<source>子元素来实现。二代码<!DOCTYPE html><html><head> <meta name="author" content

2017-04-11 20:46:58 186

HTML5的video元素应用

一介绍HTML5 <video> 元素是一个HTML5元素，在HTML4中是非法的，但在所有浏览器中都有效。该元素使用非常简单，举例如下二代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org...

2017-04-10 20:32:01 124

空空如也

空空如也