PHP连接MySQL应用 一 代码<?php$host = "127.0.0.1"; //$userName = "root"; //$password = "root"; //if ($connID = mysql_connect($host, $userName, $password)){ // echo "<script language...
docker仓库命令 一 注册登录1、注册在 https://hub.docker.com/ 官网注册一个用户,需要输入用户名,密码和邮箱。2、登录[root@localhost ~]# docker login -u cakin24 -p ******Login Succeeded[root@localhost ~]# 二 上传本地镜像到官方https://hub.docker.co...
Docker 镜像常用命令 一 列出镜像列表使用docker images来列出本地主机上的镜像。[root@localhost ~]# docker imagesREPOSITORY TAG IMAGE ID CREATED SIZEdocker.io/ubuntu latest ...
docker容器相关命令 一 创建容器可以使用docker create命令新建一个容器。[root@localhost ~]# docker create -it ubuntu:latest5097a7a94472e22bcc38f0d2fe4a1fcf2ab49b047a261f9f62da4ac5a89c27b9[root@localhost ~]# docker ps -aCONTAINER ...
上传代码到Git远程仓库(Github) 一 在官网https://github.com/注册一个账号。二 在网站内创建一个仓库,取名叫code。三 将本地的文件上传到远程仓库。[root@localhost ~]# pwd/root[root@localhost ~]# echo "# code" >>READE.md[root@localhost ~]# cat READE.md # code...
后台模式启动容器 第一步:使用以下命令创建一个以进程方式运行的容器[root@localhost ~]# docker run -d ubuntu:15.10 /bin/sh -c "while true; do echo hello world; sleep 1; done"fc7112c18128b23c4a5aa06b6f231d107a874ab398e7bf4d0160095571360a1d...
怎样使用Docker帮助 一 直接输入docker命令来查看Docker客户端的所有命令选项。[root@localhost ~]# dockerUsage: docker [OPTIONS] COMMAND [arg...] docker [ --help | -v | --version ] A self-sufficient runtime for containers. ...
运行交互式的容器 我们通过docker的两个参数 -i -t,让docker运行的容器实现"对话"的能力[root@localhost ~]# docker run -i -t ubuntu:15.10 /bin/bashroot@8b58c26d093d:/# 各个参数解析:-t:在新容器内指定一个伪终端或终端。-i:允许你对容器内的标准输入 (STDIN) 进行交互。此时我们已进入一个...
一个简单的例子Docker Hello World 一 简介Docker允许你在容器内运行应用程序,使用docker run命令来在容器内运行一个应用程序。 二 运行脚本[root@localhost ~]# docker run ubuntu:15.10 /bin/echo "Hello world"Unable to find image 'ubuntu:15.10' locallyTrying to pull rep...
Docker简介和学习Docker资源 一 容器简介Docker是一个开源的应用容器引擎,基于Go语言,并遵从Apache2.0协议开源。Docker可以让开发者打包他们的应用以及依赖包到一个轻量级、可移植的容器中,然后发布到任何流行的 Linux 机器上,也可以实现虚拟化。容器是完全使用沙箱机制,相互之间不会有任何接口(类似 iPhone 的 app),更重要的是容器性能开销极低。 二 Docker的应用场景...
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...
使用WebSocket进行通信的简单应用 一 应用打开一个页面,将向服务器发送一段字符串,并通过onmessage事件监听器来接受服务器返回的消息。 二 代码客户端代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <me
使用WebSocket实现多人实时聊天 一 应用本应用使用WebSocket实现多人实时聊天 二 代码客户端代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta http-equiv="Content
跨文档发送JSON消息实现图书选择 一 应用该实例允许用户打开一个页面来选择图书,当用户选择了合适的图书之后,再把用户选择的图书传回主页面。该应用是用JSON消息发送的。 二 代码1、viewBook.html<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(Craz...
HTML5 WebSocket简介 HTML5 WebSocketWebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。在WebSocket API中,浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求,连接建立以后,客户端和服务器端就可以...
跨文档消息传递应用 一 应用source.html程序调用window的open方法打开一个新的窗口,接下来程序即可调用新窗口对应的window对象的postMessage向该文档发送消息。 二 代码1、source.html<!DOCTYPE html><html><head> <meta name="author" con...
Worker子线程之间的数据交换应用 一 应用1、第一条Worker线程负责收集指定范围内的质数。2、第二条Worker线程负责从指定范围的质数中随机抽取指定数量的质量。 二 代码1、calPrime.html<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(Cra...
与Web Worker线程交换数据应用 一 应用该应用允许用户输入两个数,两个数确定一个范围,而程序代码则计算、收集这个范围的所有质数。 二 代码1、HTML代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta
嵌套Worker线程应用 一 应用1、前台JS脚本先启动一个Worker线程,该Worker线程负责收集该范围内的所有质数。2、程序把收集到的所有质数再次提交给另外一个Worker线程统计出指定的质数。 二 代码1、calPrime.html<!DOCTYPE html><html><head><metaname="author"cont...
使用Web Worker创建多线程应用 一 介绍HTML5 Web Workersweb worker是运行在后台的JavaScript,不会影响页面的性能。什么是 Web Worker当在HTML页面中执行脚本时,页面的状态是不可响应的,直到脚本已完成。web worker是运行在后台的JavaScript,独立于其他脚本,不会影响页面的性能。您可以继续做任何愿意做的事情:点击、选取内容等等,而此时web w...
判断浏览器在线状态 一 介绍为了判断浏览器的在线状态,HTML 5提供了两种方法来检测是否在线。1、navigator.onLine属性:该属性可返回当前是否在线。如果返回true,则表示在线,如果返回false,则表示离线。当网络状态发生变化时,该值也会随之变化。2、online/offline事件:如果开发者需要在网络状态发生变化时立刻得到通知,则可以通过HTML 5的online/offline事...
构建web离线应用 一 构建步骤1、搭建web服务器2、给<Html>元素增加manifest属性3、编辑manifest文件。 二 代码核心代码:1、HTML文件(index.html)<!DOCTYPE html><htmlmanifest="index.manifest"><head><metaname="...
Web Storage结构化存储实现更复杂的本地留言板 一 介绍Web Storage结构化存储的实现步骤如下:1、存储结构化数据1.1:把结构数据封装在JSON对象中。1.2:把JSON对象转换为字符串后再进行保存。2、读取结构化数据2.1:读取JSON格式的字符串。2.2:通过JSON对象的属性来提取。 二 代码<!DOCTYPE html><html><head&...
基于Web Storage的客户端留言板 一 代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta http-equiv="Content-Type" content="text/html; chars
HTML5的Web存储应用 一 介绍HTML5 web存储,一个比cookie更好的本地存储方式。1、什么是HTML5 Web存储使用HTML5可以在本地存储用户的浏览数据。早些时候,本地存储使用的是cookie。但是Web存储需要更加的安全与快速,这些数据不会被保存在服务器上,但是这些数据只用于用户请求网站数据上,它也可以存储大量的数据,而不影响网站的性能。数据以 键/值 对存在, web网页的数...
DOM取消事件默认行为应用 一 介绍DOM提供了preventDefault方法来取消事件对象的默认行为。 二 代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta http-equiv="C
跨浏览器拖动HTML元素 一 代码HTML代码:<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta http-equiv="Content-Type" content="text
DOM模型转发事件应用 一 介绍DOM提供了dispatchEvent方法用于事件的转发,该方法属于Node对象,因此DOM的每个Node都可以调用该方法,从而将事件直接转发到本节点。 二 代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt....
DOM模型事件传播机制应用 一 介绍DOM模型事件传播先后沿着两个方向传播:在第一阶段,也就是事件捕获阶段,事件从最顶层的对象依次向下传播,因此先触发顶层对象的事件处理函数,然后依次向下,直到传播到事件所发生的最底层对象;接着进入第二阶段,也就是事件冒泡阶段,事件传播一直向上溯,直到最顶层对象。DOM模型事件传播机制模型如下图 DOM为Event对象提供了stoppropagation()方法,该方法能...
跨浏览器访问事件的方法 一 介绍1、DOM事件模型和IE事件模型访问事件对象的方式完全不同,因此需要写一个跨浏览器的程序。2、实现跨浏览器的通常做法是:将事件处理函数绑定到DOM对象的属性上。 二 代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(Cr...
DOM绑定事件处理器 一 介绍DOM提供了一种事件绑定机制,它提供的事件绑定方法是addEventListener(event, function, useCapture),该方法三个参数event:必需。描述事件名称的字符串。注意:不要使用 "on" 前缀。例如,使用 "click" 来取代 "onclick"。function:必需。描述了事件触发后执行的函数。当事件触发时,事件对象会作为第一个参数传...
IE浏览器的事件冒泡机制 一 介绍1、当浏览者在页面上执行了某个动作,页面上实际上有多个元素可以响应该事件,假如单机页面的某个按钮,该按钮又处于<div>元素之内,则实际上用户既单机了该按钮,也单击了<div>元素。2、IE中的事件传递方向是从事件发生的对象开始,然后依次向该对象所在的父节点传递。这种传递方式是从下向上传递的,因此这种事件的传递机制又称为冒泡。3、下面应用说明了这种机制...
绑定DOM对象属性来触发事件处理函数 一 介绍在处理Javascript的监听事件处理函数时,常用到两种方式:1、通过绑定HTML元素的属性2、通过绑定DOM对象属性本篇介绍第2种方式来进行监听事件处理 二 代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Le...
分析浏览器的时间性能 一 介绍HTML5为window对象新增了performance属性,也就是新增了一个全局可用的performance对象,就像document、navigator等对象一样,通过该对象可以对浏览器进行相关分析。 二 代码<!DOCTYPE html><html><head> <meta name="author" con...
动态页面 一 介绍借助document对象的open和write方法,可以动态生成一个页面。 二 代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta http-equiv="
Javascript中的Cookie应用 一 什么是 CookieCookie 是一些数据, 存储于你电脑上的文本文件中。当 web 服务器向浏览器发送 web 页面时,在连接关闭后,服务端不会记录用户的信息。Cookie 的作用就是用于解决 "如何记录客户端的用户信息":当用户访问 web 页面时,他的名字可以记录在 cookie 中。在用户下一次访问该页面时,可以在 cookie 中读取用户访问记录。Cook...
使用navigator对象的geolocation获取地理位置 一 介绍HTML5为navigator新增了一个geolocation属性,这个属性是一个Geolocation对象,通过该对象获取浏览者的地理位置。下面应用示范了geolocation的用法。 二 代码<script type="text/javascript"> var geoHandler = function(position) { ...
DHTML模型的navigator对象 一 介绍window对象有一个navigator属性,它属于Navigator对象,该对象代表浏览该页面所使用的浏览器。下面应用示范了navigator对象的常用属性。 二 代码<script type="text/javascript"> alert(window.navigator); var browser = "当前的浏览器信息是:";...
DHTML模型的screen对象 一 介绍window对象有一个screen属性,它返回当前浏览者的屏幕对象,可用于获取用户屏幕当前大小、色深、屏幕分辨率等参数。下面应用示范了screen对象的常用属性。 二 代码<script type="text/javascript"> alert(window.screen); var str = "当前的屏幕信息是:"; // 遍历s...
DHTML模型的location对象 一 介绍window对象包含一个location属性,该属性可用于访问该窗口或Frame所装载文档的地址。下面应用示范了location对象的常用属性。 二 代码<script type="text/javascript"> var loc = window.location; var locStr = "当前的location信息是:"; /...
DHTML模型的window对象 一 介绍window对象是整个JavaScirpt脚本运行的顶层对象。在定义一个全局变量时,该变量是作为window对象的一个属性存在的。 二 代码<script type="text/javascript"> // 定义全局变量a var a = 5; // 判断window对象的属性a和全局变量a是否相等 alert(window.a ==...
传统的DHTML模型 一 DHTML对象模型包含关系图在下图中,window对象是整个对象模型的顶层对象,该对象包含document属性,该属性代表该窗口内的HTML文档,如果该窗口内有多个Frame,则可以使用frames[]方法依次访问该窗口的每个Frame。document对象代表HTML文档本身,document对象又包含一系列的属性:forms、anchors、links、images......这...
利用DOM节点关系访问HTML元素 一 介绍一旦获取了某个元素,由于元素实际与DOM树的某个节点对应,因此我们完全可以利用节点之间的父子关系、兄弟关系来访问HTML元素。下面应用利用节点关系访问HTML元素。 二 代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(...
删除表格的行或单元格 一 介绍删除表格的指定表格行使用HTMLTableElement对象的如下方法:deleteRow删除表格行的指定单元格使用HTMLRowElement对象的如下方法:deleteCell 二 代码<!DOCTYPE html><html><head><meta name="author" content="Yeek...
HTML5的音频和视频监听器应用 一 介绍1、<audio>和<video>元素有不少监听事件,因此可以绑定这些事件的监听器。2、本应用实现<video>的ontimeupdate事件的监听器。3、通过ontimeupdate事件绑定监听器可以实时监控音频、视频的播放位置。 二 代码<!DOCTYPE html><html><...
使用JavaScript脚本控制媒体播放 一 介绍1、在HTML页面中获取<audio>和<video>元素播放音频和视频之外,很多时候我们还需要JavaScript来控制这些元素的播放。2、在JavaScript中获取<audio>元素对应的对象为HTMLAudioElement的对象,<vidio>元素对应的对象为HTMLVideoElement对象。3、HTMLAudio...
HTML5的video元素和audio元素兼容性 一 介绍因为各浏览器对音频和视频的支持互不相同,开发者可能希望为<video>和<audio>元素指定多个媒体源,此时可以借助<source>子元素来实现。 二 代码<!DOCTYPE html><html><head> <meta name="author" content
HTML5的video元素应用 一 介绍HTML5 <video> 元素是一个HTML5元素,在HTML4中是非法的,但在所有浏览器中都有效。该元素使用非常简单,举例如下 二 代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org...
HTML5的audio元素应用 一 介绍HTML5 <audio> 元素是一个HTML5元素,在HTML4中是非法的,但在所有浏览器中都有效。该元素使用非常简单,举例如下 二 代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.o...
Canvas 输出位图 一 介绍toDataURL()是canvas中将图片的二进制格式转为dataURL格式使用的方法。dataURL是将数据按base64进行编码,它是一种保存二进制的方式。下面通过这种方法输出位图。 二 代码<!DOCTYPE html><html><head> <meta name="author" content...
Canvas 像素处理之高亮处理 一 定义和用法getImageData()方法返回 ImageData 对象,该对象拷贝了画布指定矩形的像素数据。注意:ImageData对象不是图像,它规定了画布上一个部分(矩形),并保存了该矩形内每个像素的信息。对于ImageData对象中的每个像素,都存在着四方面的信息,即RGBA值:R - 红色(0-255)G - 绿色(0-255)B - 蓝色(0-255)...
Canvas 位图裁剪 一 位图裁剪方法1、将需要从位图上裁剪的部分定义成Canvas的路径。2、调用CanvasRenderingContext2D的的clip()方法把路径剪切出来。3、绘制位图——此时只要被clip()的路径覆盖的部分才会被显示出来。二 代码<!DOCTYPE html><html><head> <meta name="...
Canvas 像素处理之改变透明度 一 定义和用法getImageData()方法返回 ImageData 对象,该对象拷贝了画布指定矩形的像素数据。注意:ImageData对象不是图像,它规定了画布上一个部分(矩形),并保存了该矩形内每个像素的信息。对于ImageData对象中的每个像素,都存在着四方面的信息,即RGBA值:R - 红色(0-255)G - 绿色(0-255)B - 蓝色(0-255)...
Canvas 位图填充 一 位图填充方法1、调用createPattern方法创建位图填充,该方法返回一个CanvasPattern对象。2、将CanvasPattern对象赋值给CanvasRenderingContext2D的fillStyle或StrokeStyle属性。二 代码<!DOCTYPE html><html><head> <me...
Canvas 圆形渐变 一 介绍渐变可以填充在矩形, 圆形, 线条, 文本等等, 各种形状可以自己定义不同的颜色。以下是设置Canvas圆形渐变的方法:createRadialGradient(x,y,r,x1,y1,r1) - 创建一个圆形渐变。当我们使用渐变对象,必须使用两种或两种以上的停止颜色。addColorStop()方法指定颜色停止,参数使用坐标来描述,可以是0至1.使用渐变,设置f...
Canvas 线性渐变 一 介绍渐变可以填充在矩形, 圆形, 线条, 文本等等, 各种形状可以自己定义不同的颜色。以下用来设置Canvas的线性渐变:createLinearGradient(x,y,x1,y1) - 创建线条渐变。当我们使用渐变对象,必须使用两种或两种以上的停止颜色。addColorStop()方法指定颜色停止,参数使用坐标来描述,可以是0至1。使用渐变,设置fillStyle...
HTML5 简介 HTML5是HTML最新的修订版本,2014年10月由万维网联盟(W3C)完成标准制定。HTML5的设计目的是为了在移动设备上支持多媒体。HTML5 简单易学。一 什么是 HTML5HTML5 是下一代 HTML 标准。HTML , HTML 4.01的上一个版本诞生于 1999 年。自从那以后,Web 世界已经经历了巨变。HTML5 仍处于完善之中。然而,大部分现代浏览...
jQuery中的事件绑定 在页面加载完毕时,程序可以通过为元素绑定事件完成相应的操作。在jQuery中,事件绑定通常可以分为为元素绑定事件、移除绑定和绑定一次性事件处理3种情况,下面分别进行介绍。一 为元素绑定事件在jQuery中,为元素绑定事件可以使用bind()方法,该方法的语法结构如下:bind(type,[data],fn)type:事件类型。data:可选参数,作为event.data属...
jQuery中的事件 只有页面加载显然是不够的,程序在其他的时候也需要完成某个任务。比如鼠标单击(onclick)事件,敲击键盘(onkeypress)事件以及失去焦点(onblur)事件等。在不同的浏览器中事件名称是不同的,例如在IE中的事件名称大部分都含有on,如onkeypress()事件,但是在火狐浏览器却没有这个事件名称。jQuery帮助我们统一了所有事件的名称。jQuery中的事件如下表所示。...
jQuery创建节点 一 介绍创建元素节点包括两个步骤,一是创建新元素,二是将新元素插入到文档中(即父元素中)。二 应用要在文档的body元素中创建一个新的段落节点可以使用下面的代码:三 代码 <script language="javascript" src="JS/jquery-3.1.1.min.js"></script><script type="te...
jQuery页面加载响应事件 $(document).ready()方法是事件模块中最重要的一个函数,它极大地提高了Web响应速度。$(document)是获取整个文档对象,从这个方法名称来理解,就是获取文档就绪的时候。方法的书写格式为: $(document).ready(function() { //在这里写代码});可以简写成: $().ready(func...
jQuery对元素值操作 一 jQuery提供了3种对元素值操作的方法方法说明示例var()用于获取第一个匹配元素的当前值,返回值可能是一个字符串,也可能是一个数组。例如当select元素有两个选中值时,返回结果就是一个数组$("#username").val(); //获取id为username的元素的值var(val)用于设置所有匹配元素的值...
jquery的元素的文本内容与HTML内容操作的区别 一 应用获取和设置元素的文本内容与HTML内容二 代码<script language="javascript" src="JS/jquery-3.1.1.min.js"></script>应用text()方法设置的内容<div id="div1"> <span id="clock">当
jQuery对元素内容操作 jQuery提供了对元素的内容和值进行操作的方法,其中,元素的值是元素的一种属性,大部分元素的值都对应value属性。下面我们再来对元素的内容进行介绍。元素的内容是指定义元素的起始标记和结束标记中间的内容,又可分为文本内容和HTML内容。那么什么是元素的文本内容和HTML内容?通过下面这段来说明。<div> <p>测试内容</p>...
jquery表单选择器 一 介绍表单选择器是匹配经常在表单内出现的元素。但是匹配的元素不一定在表单中。jQuery提供的表单选择器如下表所示。选择器说明示例:input匹配所有的input元素$(":input") //匹配所有的input元素$("form :input") //匹配<form>标记中的所有input元素,需要注意...
jquery表单对象的属性过滤器 一 介绍表单对象的属性过滤器通过表单元素的状态属性(例如选中、不可用等状态)匹配元素,包括:checked过滤器、:disabled过滤器、:enabled过滤器和:selected过滤器4种。过滤器说明示例:checked匹配所有选中的被选中元素$("input:checked") //匹配checked属性为checked的inpu...
jquery可见性过滤器 一 介绍元素的可见状态有两种,分别是隐藏状态和显示状态。可见性过滤器就是利用元素的可见状态匹配元素的。因此,可见性过滤器也有两种,一种是匹配所有可见元素的:visible过滤器,另一种是匹配所有不可见元素的:hidden过滤器。在应用:hidden过滤器时,display属性是none以及input元素的type属性为hidden的元素都会被匹配到。二 应用获取页面上隐...
jquery内容过滤器 一 介绍内容过滤器就是通过DOM元素包含的文本内容以及是否含有匹配的元素进行筛选。内容过滤器共包括:contains(text)、:empty、:has(selector)和:parent4种,如下表所示。过滤器说明示例contains(text)匹配包含给定文本的元素$("li:contains('DOM')") //匹配含有“DOM”文本...
jquery简单过滤器 一 介绍简单过滤器是指以冒号开头,通常用于实现简单过滤效果的过滤器。例如,匹配找到的第一个元素等。jQuery提供的过滤器下表所示。过滤器说明示例:first匹配找到的第一个元素,它是与选择器结合使用的$("tr:first") //匹配表格的第一行:last匹配找到的最后一个元素,它是与选择器结合使用的$("tr:l...
隔行换色并且鼠标指向行变色的表格 一 应用对于一些清单型数据,通常是利用表格展示到页面中。如果数据比较多,很容易看串行。这时,可以为表格添加隔行换色并且鼠标指向行变色功能。 二 代码<script language="javascript" src="JS/jquery-3.1.1.min.js"></script><style type="text/css">ta..
jQuery的prev~siblings选择器 一 介绍prev~siblings选择器用于匹配prev元素之后的所有siblings元素。其中,prev和siblings是两个相同辈元素。prev~siblings选择器的使用方法如下:$("prev~siblings");prev是指任何有效的选择器。siblings是一个有效选择器并紧接着prev选择器。例如,要匹配div元素的同辈元素ul,可以使用下面的jQue...
JQuery的prev + next选择器 一 介绍prev + next选择器用于匹配所有紧接在prev元素后的next元素。其中,prev和next是两个相同级别的元素。prev + next选择器的使用方法如下: $("prev + next");prev是指任何有效的选择器。next是一个有效选择器并紧接着prev选择器。例如,要匹配<div>标记后的<img>标记,可以使用下面的j...
jQuery的parent > child选择器 一 介绍parent > child选择器中的parent代表父元素,child代表子元素,用于在给定的父元素下匹配所有的子元素。使用该选择器只能选择父元素的直接子元素。parent > child选择器的使用方法如下:$("parent > child");parent是指任何有效的选择器。child是用以匹配元素的选择器,并且它是匹配元素的选择器,并且它...
jQuery ancestor descendan选择器 一 介绍ancestor descendan选择器中的ancestor代表祖先,descendant代表子孙,用于在给定的祖先元素下匹配所有的后代元素。ancestor descendan选择器的使用方法如下: $("ancestor descendant");ancestor是指任何有效的选择器。descendant是用以匹配元素的选择器,并且它是ancestor所指定元素...
jQuery复合选择器 一 介绍复合选择器将多个选择器(可以是ID选择器、元素选择或是类名选择器)组合在一起,两个选择器之间以逗号“,”分隔,只要符合其中的任何一个筛选条件就会被匹配,返回的是一个集合形式的jQuery包装集,利用jQuery索引器可以取得集合中的jQuery对象。多种匹配条件的选择器并不是匹配同时满足这几个选择器的匹配条件的元素,而是将每个选择器匹配的元素合并后一起返回。复合选择器的使用方...
jQuery类名选择器(.class) 一 介绍类名选择器是通过元素拥有的CSS类的名称查找匹配的DOM元素。在一个页面中,一个元素可以有多个CSS类,一个CSS类又可以匹配多个元素,如果有元素中有一个匹配的类的名称就可以被类名选择器选取到。类名选择器很好理解,在大学的时候大部分人一定都选过课,可以把CSS类名理解为课程名称,元素理解成学生,学生可以选择多门课程,而一门课程又可以被多名学生所选择。CSS类与元素的关系既...
jQuery元素选择器(element) 一 介绍元素选择器是根据元素名称匹配相应的元素。通俗的讲元素选择器指向的是DOM元素的标记名,也就是说元素选择器是根据元素的标记名选择的。可以把元素的标记名理解成学生的姓名,在一个学校中可能有多个姓名为“刘伟”的学生,但是姓名为“吴语”的学生也许只有一个,所以通过元素选择器匹配到的元素可能有多个,也可能是一个。多数情况下,元素选择器匹配的是一组元素。元素选择器的使用方法如下:...
jQuery的ID选择器 基本选择器在实际应用中比较广泛,建议重点掌握jQuery的基本选择器,它是其他类型选择器的基础,基础选择器是jQuery选择器中最为重要的部分。jQuery基本选择器包括ID选择器、元素选择器、类名选择器、多种匹配条件选择器和通配符选择器。本篇介绍ID选择器。一 ID选择器(#id)ID选择器#id顾名思义就是利用DOM元素的id属性值来筛选匹配的元素,并以jQuery包装集的形式返...
jQuery的工厂函数 jQuery的工厂函数“$”。在jQuery中,无论我们使用哪种类型的选择符都需要从一个“$”符号和一对“()”开始。在“()”中通常使用字符串参数,参数中可以包含任何CSS选择符表达式。下面介绍几种比较常见的用法。1、在参数中使用标记名$("div"):用于获取文档中全部的<div>。2、在参数中使用ID$("#username"):用于获取文档中ID属...
jQuery下载与配置 要在自己的网站中应用jQuery库,需要下载并配置它,下面将介绍如何下载与配置jQuery。一 下载jQueryjQuery是一个开源的脚本库,我们可以从它的官方网站(http://jquery.com)中下载到。下面介绍具体的下载步骤。1、在浏览器的地址栏中输入http://jquery.com,并按下〈Enter〉键,将进入到jQuery官方网站的首页。2、在jQuery...
jQuery的插件 jQuery具有强大的扩展能力,允许开发人员使用或是创建自己的jQuery插件来扩展jQuery的功能,这些插件可以帮助开发人员提高开发效率,节约项目成本。而且一些比较著名的插件也受到了开发人员的追捧,插件又将jQuery的功能提升了一个新的层次。下面介绍插件的使用和目前比较流行的插件。一 插件的使用jQuery插件的使用比较简单,首先将要使用的插件下载到本地计算机中,然后按照下...
jQuery概述 一 介绍jQuery是一套简洁、快速、灵活的JavaScript脚本库,它是由John Resig于2006年创建的,它帮助我们简化了JavaScript代码。JavaScript脚本库类似于java的类库,我们将一些工具方法或对象方法封装在类库中,方便用户使用。jQuery因为它的简便易用,已被大量的开发人员推崇。jQuery是脚本库,而不是框架。“库”不等于“框架”,例如“Syste...
Ajax 重构的步骤 Ajax重构大致可以分为以下3三个步骤。一 创建一个单独的JS文件,名称为AjaxRequest.js,并且在该文件中编写重构Ajax 所需的代码具体代码如下:var net = new Object(); // 定义一个全局的变量// 编写构造函数net.AjaxRequest = function(url,onload,onerror,method,params)...
Ajax解决中文乱码问题 Ajax不支持多种字符集,它默认的字符集是UTF-8,所以在应用Ajax技术的程序中应及时进行编码转换,否则对于程序中出现的中文字符将变成乱码。一般情况下,有以下两种情况可以产生中文乱码。一、发送请求时出现中文乱码将数据提交到服务器有两种方法,一种是使用GET方法提交;另一种是使用POST方法提交。使用不同的方法提交数据,在服务器端接收参数时解决中文乱码的方法是不同的。具体解...
与服务器通信——发送请求与处理响应 一 发送请求Ajax可以通过XMLHttpRequest对象实现采用异步方式在后台发送请求。通常情况下,Ajax发送请求有两种,一种是发送GET请求,另一种是发送POST请求。但是无论发送哪种请求,都需要经过以下4个步骤。1、初始化XMLHttpRequest对象。为了提高程序的兼容性,需要创建一个跨浏览器的XMLHttpRequest对象,并且判断XMLHttpReque...
XMLHttpRequest对象的常用属性 XMLHttpRequest对象提供了一些常用属性,通过这些属性可以获取服务器的响应状态及响应内容等,下面将对XMLHttpRequest对象的常用属性进行介绍。 一 指定状态改变时所触发的事件处理器的属性XMLHttpRequest对象提供了用于指定状态改变时所触发的事件处理器的属性onreadystatechange。在Ajax中,每个状态改变时都会触发这个事件处理器,通常...
XMLHttpRequest对象的常用方法 XMLHttpRequest对象提供了一些常用的方法,通过这些方法可以对请求进行操作。下面对XMLHttpRequest对象的常用方法进行介绍。一 创建新请求的方法open()方法用于设置进行异步请求目标的URL、请求方法以及其他参数信息,具体语法如下:open("method","URL"[,asyncFlag[,"userName"[, "password"]]])ope...
初始化XMLHttpRequest对象 在使用XMLHttpRequest对象发送请求和处理响应之前,首先需要初始化该对象,由于XMLHttpRequest不是一个W3C标准,所以对于不同的浏览器,初始化的方法也是不同的。通常情况下,初始化XMLHttpRequest对象只需要考虑两种情况,一种是IE浏览器,另一种是非IE浏览器,下面分别进行介绍。一 IE浏览器IE浏览器把XMLHttpRequest实例化为一个Acti...
Ajax需要注意的几个问题 在应用Ajax时,需要注意安全问题、性能问题和浏览器兼容性问题,下面进行具体介绍。一 安全问题随着网络的普及,安全问题已经是一个不可忽略的重要问题了。由于Web本身就是不安全的,所以尽可能降低Ajax的安全风险就显得尤为重要了。Ajax应用主要面临以下安全问题。l、JavaScript本身的安全性虽然JavaScript的安全性已逐步提高,提供了很多受限功能,包括访问浏览器的历史...
Ajax使用的技术 Ajax是XMLHttpRequest对象和JavaScript、XML、CSS、DOM等多种技术的组合。其中,只有XMLHttpRequest对象是新技术,其他的均为已有技术。下面我们就对Ajax使用的技术进行简要介绍。一 XMLHttpRequest对象Ajax使用的技术中,最核心的技术就是XMLHttpRequest,它是一个具有应用程序接口的JavaScript对象,能够使用...
Ajax技术特点 一 优点与传统的Web应用不同,Ajax在用户与服务器之间引入一个中间媒介(Ajax引擎),从而消除了网络交互过程中的处理——等待——处理——等待的缺点,从而大大改善了网站的视觉效果。下面我们就来看看使用Ajax的优点有哪些。(1)可以把一部分以前由服务器负担的工作转移到客户端,利用客户端闲置的资源进行处理,减轻服务器和带宽的负担,节约空间和成本。(2)无刷新更新页面,从而使用户...
AJAX 简介 AJAX 是什么AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。AJAX = Asynchronous JavaScript and XML。AJAX 是一种用于创建快速动态网页的技术。AJAX 通过在后台与服务器进行少量数据交换,使网页实现异步更新。这意味着可以在不重载整个页面的情况下,对网页的某些部分进行更新。传统的网页(不使用 AJAX)如果需要...
JavaScript编写MD5加密 一 介绍MD5是Message-Digest Algorithm 5即信息-摘要算法5,是在计算机语言当中普遍使用的一种杂凑程序,由于类似于函数,这里称为算法。MD5算法由MD2、MD3和MD4完善而来。它的基本原理是将一个字符串或汉字等,通过使用函数转换为另一种新的字符串,并且这种运算不可逆转。MD5算法的公开性和安全性,因此被广泛使用在各种程序语言中。MD5算法已经被各种语言...
屏蔽部分按键 一 介绍在某些购物网站上进行提交商品表单时,通常情况下不允许用户刷新屏幕、后退或新建文档,否则可能造成不可估计的损失。为避免这种情况出现,可以通过屏蔽键盘的回车键、退格键、<F5>键、<Ctrl+N>组合键和<Shift+F10>组合键来实现。本示例主要应用JavaScript脚本中的event对象的相关属性实现。其中KeyCode属性表示按下...
屏蔽鼠标右键 一 介绍用户浏览网站时,经常会使用鼠标右键,进行快捷方式的操作,例如“查看源文件”、“刷新”等。但是某些网站并不想让用户执行这些操作,这时就需要屏蔽鼠标的右键操作。那么如何禁止用户使用鼠标右键呢?可以通过JavaScript脚本调用鼠标事件(onmousedown事件)覆盖鼠标右键的快捷菜单来实现。 二 屏蔽鼠标右键应用运行本实例,当用户单击鼠标右键时,会弹出对话框屏蔽右...
Internet Explorer安全区域 控制脚本的安全策略,如果设置的太严格将会失去脚本的部分功能,如果设置的太宽松,将会失去安全性。为了在Internet Explorer浏览器中灵活使用脚本,可以通过安全区域来设置安全策略。Internet Explorer的安全区域分为4个区域,分别如下。Internet区域此区域包括所有Web网站。默认安全级别为“中”。本地Intranet区域此...
JavaScript恶意代码 一 介绍使用JavaScript进行程序开发时,可以使用JavaScript的部分属性或方法来提高安全性,但也会无意编写出恶意代码。 二 恶意代码举例在编写代码时,有可能由于疏忽编写出浪费系统资源的恶意代码,造成浏览器崩溃或者死机。下面来看几段浪费系统资源的代码。1、下面一段代码造成了死循环。当退出循环的条件永远不成立时,这个循环被称为死循环。死循环会造成系统资源的浪费,...
应用CSS转换XML文档 一 介绍通过CSS转换XML文档,其链接CSS样式文件的语法格式如下:语法:<?xml-stylesheet type="text/css" href="CSS样式表文件路径"?>通过该语句来引用一个外部的CSS文件,实现XML文档的格式化输出。 二 应用CSS转换XML文档在实例中应用CSS样式实现XML文档的格式化输出。 三 代码1、CS...
同源策略 一 介绍同源策略是JavaScript主要的安全策略,表示一个脚本只能读取与它同源的窗口或文档的属性,这样可以防止从一个站点载入的脚本获取或设置另一站点的文档属性。例如,使用一段恶意的脚本代码在一个浏览器中运行,如果没有同源策略,此段恶意代码就有可能获取另一个浏览器窗口中的信息,而该窗口中有可能包含部分私有信息。同源策略用来检测两个URL是否属于同一个源。当一个脚本试图访问另一个...