ajax论文Word文档下载推荐.docx
- 文档编号:1299251
- 上传时间:2023-04-30
- 格式:DOCX
- 页数:30
- 大小:1,005.48KB
ajax论文Word文档下载推荐.docx
《ajax论文Word文档下载推荐.docx》由会员分享,可在线阅读,更多相关《ajax论文Word文档下载推荐.docx(30页珍藏版)》请在冰点文库上搜索。
2、打开plugInsNew,在其中新建一个你插件容易记的文件夹,比如:
aptana_update_024747(自定义)
3、打开aptana_update_024747在其中新建一个eclipse(名字固定)文件夹;
4、打开eclipse文件夹,将你的features和plugins文件夹放入;
5、在plugInsNew同级目录新建links文件夹(如有可省);
6、在links文件夹里新建文件(名字自定义,后缀名是.link)
如:
aptana_update_024747.link文件,并将插件路径引入:
如
path=E:
\\eclipse\\pluginsNew\\aptana_update_024747
重新启动eclipse即可!
这样引入插件的好处是可以方便的识别,加入或删除你所需要的插件!
Aptana插件在MyEcpise中安装
myeclipse插件引入方法
1、在D盘新建文件夹pluginsNew(自定义)
2、打开pluginsNew,在其中新建一个你插件容易记的文件夹,比如:
aptana_update_024747
3、打开aptana_update_024747在其中新建一个eclipse文件夹;
5、找到myecplise的安装目录D:
\ProgramFiles\MyEclipse
6.5\eclipse\links下的links文件夹
6、在links文件夹里新建文件如:
aptana_update_024747.link文件,并将
插件路径引入:
如
path=D:
\\pluginsNew\\aptana_update_024747
重新启动myeclipse即可!
javaScript基础知识
links链接对象<
a>
<
a/>
archors锚对象
forms表单对象
images图片对象
浏览器的对象树---BOM
document
(文档对象)
frame(框架对象)
location(位置对象)
history(历史对象)
1.navigator
2.Window
浏览器的对象含义
Navigator对象:
浏览器对象,包含了正在使用的Navigator的版本信息。
反映了当前使用的浏览器的资料。
JavaScript客户端运行时刻引擎自动创建navigator对象。
Window对象:
表示的是浏览器窗口,最顶层的对象,window的属性对应于整个窗口。
Document对象:
文档对象是JavaScript
中window
和frames对象的一个属性,是显示于窗口或框架内的一个文档。
描述当前窗口或指定窗口对象的文档。
它包含了文档从<
head>
到<
/body>
的内容。
Frame
对象:
是
window
对象。
用最容易理解的话说,每一个HTML
文件占用一个
对象,
包括定义框架的网页
(“框架网页”)
Location对象:
地址对象
它描述的是某一个窗口对象所打开的地址。
*window.location=“链接地址”;
History对象:
历史对象包含了用户已浏览的
URL
的信息,是指历史对象指浏览器的浏览历史。
*back()
后退,跟按下“后退”键是等效的。
*forward()
前进,跟按下“前进”键是等效的。
Links对象:
是一个数组,
包含了文档中所有连接标记
(包含
href
属性的<
标记和<
map>
标记段里的<
area>
标记),按照在文档中的次序,从
0
开始给每个连接标记定义了一个下标。
Archors对象:
是一个数组,包含了文档中所有锚标记(包含
name
属
性的<
标记),
按照在文档中的次序,
从
开始给每个锚标记定义了一个下标。
Forms对象:
是一个数组,包含了文档中所有的表单(<
form>
)。
要引用单个表单,可以用
document.forms[x],但是一般来说,人们都会这样做:
在<
标记中加上“name=”...“”属性,那么直接用“document.<
表单名>
”就可以引用了。
Images对象:
图片对象
document.images[]
是一个数组,包含了文档中所
有的图片(<
img>
●每个对象有它自己的属性、方法和事件。
●对象的属性是反映该对象某些特定的性质的。
●例如:
字符串的长度、图像的长宽等等。
●对象的方法能对该对象做一些事情。
●例如:
表单的“提交”(Submit)等等。
●对象的事件就
能响应发生在对象上的事情。
提交表单产生表单的“提交事件”。
window对象常用方法
●alert(‘信息’):
消息框
●prompt(‘提示信息’,默认值):
标准输入框
●confirm():
确认框
●open():
打开一个新窗口
●close():
关闭窗口
Form表单对象
访问表单的方式:
*document.forms[n]
*document.表单名字
●表单对象常用的属性
action<
fromaction=”xxx”>
表单提交的目的地址
method<
formmethod=”xxx”>
表单提交方式
name<
formname=”xxx”>
表单名称
javaScript定义函数的三种方式
●正常方法
functionprint(msg){
document.write(msg);
}
对函数进行调用的几种方式:
●函数名(传递给函数的参数1,传递给函数的参数2,….)
●变量=函数名(传递给函数的参数1,传递给函数的参数2,….)
●对于有返回值的函数调用,也可以在程序中直接使用返回的结果,例如:
alert("
sum=“+square(2,3));
●不指定任何函数值的函数,返回undefined。
●构造函数方法newFunction();
//构造函数方式定义javascript函数注意Function中的F大写
varadd=newFunction('
a'
'
b'
returna+b;
'
);
//调用上面定义的add函数
varsum=add(3,4);
alert(sum);
注:
接受任意多个字符串参数,最后一个参数是函数体。
如果只传一个字符串,则其就是函数体。
●函数直接量定义函数
//使用函数直接量的方式定义函数
varresult=function(a,b){returna+b;
//调用使用函数直接量定义的函数
varsum=result(7,8);
alert(sum);
注:
函数直接量是一个表达式,它可以定义匿名函数
DOM
●DOM:
DOM是DocumentObjectModel文档对象模型的缩写。
根据W3CDOM规范,DOM是一种与浏览器,平台,语言无关的接口,使得你可以访问页面其他的标准组件
D:
文档–html文档或xml文档
O:
对象–document对象的属性和方法
M:
模型
DOM是针对xml(html)的基于树的API。
DOM树:
节点(node)的层次。
DOM把一个文档表示为一棵家谱树(父,子,兄弟)
DOM定义了Node的接口以及许多种节点类型来表示XML节点的多个方面
DOM的结构
节点及其类型
●节点
*由结构图中我们可以看到,整个文档就是一个文档节点。
*而每一个HMTL标签都是一个元素节点。
*标签中的文字则是文本节点。
*标签的属性是属性节点。
*一切都是节点……
●节点树
节点树的概念从图中一目了然,最上面的就是“树根”了。
节点之间有父子关系,祖先与子孙关系,兄妹关系。
这些关系从图中也很好看出来,直接连线的就是父子关系了。
而有一个父亲的就是兄妹关系……
Node接口的特性和方法
特性/方法
类型/返回类型
说
明
nodeName
String
节点的名字;
根据节点的类型而定义
nodeValue
节点的值;
nodeType
Number
节点的类型常量值之一
ownerDocument
Document
指向这个节点所属的文档
firstChild
Node
指向在childNodes列表中的第一个节点
lastChild
指向在childNodes列表中的最后一个节点
childNodes
NodeList
所有子节点的列表
previousSibling
指向前一个兄弟节点;
如果这个节点就是第一个兄弟节
点,那么该值为null
nextSibling
指向后一个兄弟节点;
如果这个节点就是最后一个兄弟节
hasChildNodes()
Boolean
当childNodes包含一个或多个节点时,返回真
attributes
NamedNodeMap
包含了代表一个元素的特性的Attr对象;
仅用于Element
节点
appendChild(node)
将node添加到childNodes的末尾
removeChild(node)
从childNodes中删除node
replaceChild
(newnode,oldnode)
将childNodes中的oldnode替换成newnode
insertBefore
(newnode,refnode)
在childNodes中的refnode之前插入newnode
AJAX
同步交互和异步交互
举个例子:
普通B/S模式(同步)AJAX技术(异步)
*同步:
提交请求->
等待服务器处理->
处理完毕返回这个期间客户端浏览器不能干任何事
*异步:
请求通过事件触发->
服务器处理(这时浏览器仍然可以作其他事情)->
处理完毕
同步是指:
发送方发出数据后,等接收方发回响应以后才发下一个
数据包的通讯方式。
异步是指:
发送方发出数据后,不等接收方发回响应,接着发送下
个数据包的通讯方式
易懂的理解:
异步传输:
你传输吧,我去做我的事了,传输完了告诉我一声
同步传输:
你现在传输,我要亲眼看你传输完成,才去做别的事
什么是Ajax
●Ajax的技术的产生
•Ajax被认为是(AsynchronousJavaScriptandXML的缩写)。
现在,允许浏览器与服务器通信而无须刷新当前页面的技术都被叫做Ajax.
AJAX案例之一
AJAX案例之二
●Ajax:
一种不用刷新整个页面便可与服务器通讯的办法
图1Web的传统模型。
客户端向服务器发送一个请求,服务器返回整个页面,如此反复
图2在Ajax模型中,数据在客户端与服务器之间独立传输。
服务器不再返回整个页面
●不用刷新整个页面便可与服务器通讯的办法:
•Flash
•Javaapplet
•框架:
如果使用一组框架构造了一个网页,可以只更新其中一个框架,而不必惊动整个页面
•隐藏的iframe
•XMLHttpRequest:
该对象是对JavaScript的一个扩展,可使网页与服务器进行通信。
是创建Ajax应用的最佳选择。
实际上通常把Ajax当成XMLHttpRequest对象的代名词
Ajax的工作原理
Ajax的核心是JavaScript对象XmlHttpRequest。
该对象在InternetExplorer5中首次引入,它是一种支持异步请求的技术。
简而言之,XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应,而不阻塞用户。
AJAX采用异步交互过程。
AJAX在用户与服务器之间引入一个中间媒介,从而消除了网络交互过程中的处理—等待—处理—等待缺点。
用户的浏览器在执行任务时即装载了AJAX引擎。
AJAX引擎用JavaScript语言编写,通常藏在一个隐藏的框架中。
它负责编译用户界面及与服务器之间的交互。
AJAX引擎允许用户与应用软件之间的交互过程异步进行,独立于用户与网络服务器间的交流。
现在,可以用Javascript调用AJAX引擎来代替产生一个HTTP的用户动作,内存中的数据编辑、页面导航、数据校验这些不需要重新载入整个页面的需求可以交给AJAX来执行。
使用AJAX,可以为JSP、开发人员、终端用户带来可见的便捷:
AJAX包含的技术
AJAX:
(AsynchronousJavaScriptandXML)并不是一项新技术,其实是多种技术的综合,包括Javascript、XHTML和CSS、DOM、XML和XMLHttpRequest.
服务器端语言:
服务器需要具备向浏览器发送特定信息的能力。
Ajax与服务器端语言无关。
XML(eXtensibleMarkupLanguage,可扩展标记语言)是一种描述数据的格式。
AJAX程序需要某种格式化的格式来在服务器和客户端之间传递信息,XML是其中的一种选择
XHTML(eXtendedHypertextMarkupLanguage,使用扩展超媒体标记语言)和CSS(CascadingStyleSheet,级联样式单)标准化呈现;
DOM(DocumentObjectModel,文档对象模型)实现动态显示和交互;
使用XMLHTTP组件XMLHttpRequest对象进行异步数据读取
使用JavaScript绑定和处理所有数据
AJAX的缺陷
AJAX不是完美的技术。
也存在缺陷:
1AJAX大量使用了Javascript和AJAX引擎,而这个取决于浏览器的支持。
IE5.0及以上、Mozilla1.0、NetScape7及以上版本才支持,Mozilla虽然也支持AJAX,但是提供XMLHttpRequest的方式不一样。
所以,使用AJAX的程序必须测试针对各个浏览器的兼容性。
2AJAX更新页面内容的时候并没有刷新整个页面,因此,网页的后退功能是失效的;
有的用户还经常搞不清楚现在的数据是旧的还是已经更新过的。
这个就需要在明显位置提醒用户“数据已更新”。
3对流媒体的支持没有FLASH、JavaApplet好。
4一些手持设备(如手机、PDA等)现在还不能很好的支持Ajax。
XMLHttpRequest对象
●XMLHttpRequest对象
XMLHttpRequest是XMLHTTP组件的对象,通过这个对象,AJAX可以像桌面应用程序一样只同服务器进行数据层面的交换,而不用每次都刷新界面,也不用每次将数据处理的工作都交给服务器来做;
这样既减轻了服务器负担又加快了响应速度、缩短了用户等待的时间。
●XMLHttpRequest最早是在IE5中以ActiveX组件的形式实现的。
非W3C标准.
●创建XMLHttpRequest对象(由于非标准所以实现方法不统一)
•InternetExplorer把XMLHttpRequest实现为一个ActiveX对象
•其他浏览器(Firefox、Safari、Opera…)把它实现为一个本地的JavaScript对象。
•XMLHttpRequest在不同浏览器上的实现是兼容的,所以可以用同样的方式访问XMLHttpRequest实例的属性和方法,而不论这个实例创建的方法是什么。
XMLHttpRequest对象初始化
functioncreateXmlHttpRequest(){
varxmlHttp;
try{//Firefox,Opera8.0+,Safari
xmlHttp=newXMLHttpRequest();
}catch(e){
try{//InternetExplorer
xmlHttp=newActiveXObject("
Msxml2.XMLHTTP"
try{
Microsoft.XMLHTTP"
}catch(e){}
}
returnxmlHttp;
XMLHttpRequest对象方法
方法
描述
abort()
停止当前请求
getAllResponseHeaders()
把http请求的所有响应首部作为键/值对返回
getResponseHeader("
headerLabel"
)
返回指定首部的串值
open(“method”,”url”)
建立对服务器的调用,method参数可以是GET,POST。
url参数可以是相对URL或绝对URL。
这个方法还包括3个可选参数。
send(content)
向服务器发送请求
setRequestHeader("
label"
"
value"
把指定首部设置为所提供的值。
在设置任何首部之前必须先调用open()
XMLHttpRequest对象属性
发送请求--方法和属性介绍
利用XMLHttpRequest实例与服务器进行通信包含以下3个关键部分:
•onreadystatechange事件处理函数
•open方法
•send方法
onreadystatechange:
●该事件处理函数由服务器触发,而不是用户
●在Ajax执行过程中,服务器会通知客户端当前的通信状态。
这依靠更新XMLHttpRequest对象的readyState来实现。
改变readyState属性是服务器对客户端连接操作的一种方式。
●每次readyState属性的改变都会触发readystatechange事件
open(method,url,asynch)
⏹XMLHttpRequest对象的open方法允许程序员用一个Ajax调用向服务器发送请求。
⏹method:
请求类型,类似“GET”或”POST”的字符串。
若只想从服务器检索一个文件,而不需要发送任何数据,使用GET(可以在GET请求里通过附加在URL上的查询字符串来发送数据,不过数据大小限制为2000个字符)。
若需要向服务器发送数据,用POST。
⏹在某些情况下,有些浏览器会把多个XMLHttpRequest请求的结果缓存在同一个URL。
如果对每个请求的响应不同,这就会带来不好的结果。
把当前时间戳追加到URL的最后,就能确保URL的惟一性,从而避免浏览器缓存结果。
var
url
=
"
GetAndPostExample?
timeStamp="
+
new
Date().getTime();
⏹
⏹url:
路径字符串,指向你所请求的服务器上的那个文件。
可以是绝对路径或相对路径。
⏹asynch:
表示请求是否要异步传输,默认值为true(异步)。
指定true,在读取后面的脚本之前,不需要等待服务器的相应。
指定false,当脚本处理过程经过这点时,会停下来,一直等到Ajax请求执行完毕再继续执行。
send(data):
⏹open方法定义了Ajax请求的一些细节。
send方法可为已经待命的请求发送指令
⏹data:
将要传递给服务器的字符串。
⏹若选用的是GET请求,则不会发送任何数据,给send方法传递null即可:
request.send(null);
⏹当向send()方法提供参数时,要确保open()中指定的方法是POST,如果没有数据作为请求体的一部分发送,则使用null.
⏹完整的Ajax的GET请求示例:
setRequestHeader(header,value)
⏹当浏览器向服务器请求页面时,它会伴随这个请求发送一组首部信息。
这些首部信息是一系列描述请求的元数据(metadata)。
首部信息用来声明一个请求是GET还是POST。
⏹Ajax请求中,发送首部信息的工作可以由setRequestHeader完成
⏹参数header:
首部的名字;
参数value:
首部的值。
⏹如果用POST请求向服务器发送数据,需要将“Content-type”的首部设置为“application/x-www-form-urlencoded”.它会告知服务器正在发送数据,并且数据已经符合URL编码了。
⏹该方法必须在open()之后才能调用
⏹完整的Ajax的POST请求示例:
接收--方法和属性介绍
用XMLHttpRequest的方法可向服务器发送请求。
在Ajax处理过程中,XMLHttpRequest的如下属性可被服务器更改:
ready
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- ajax 论文