AJAX 基础知识
1.AJAX 是一种用于创建快速动态网页的技术。而是一种用于创建更好更快以及交互性更强的
Web 应用程序的技术.
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重
新加载整个网页的情况下,对网页的某部分进行更新。
Ajax的核心是JavaScript对象XmlHttpRequest。
XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应,而不阻塞用户。
2.AJAX 工作原理 get post
(客户端) 用户界面->通过(javascript )-> AJAX 引擎->HttpRequest-> Web 和XML 服务
器(服务器端)->数据处理-> WEB 和 XML 服务器->XML-> AJAX 引擎-> html +css-> 用户界面
。
3.方法:
responseText 获得字符串形式的响应数据。
responseXML 获得 XML 形式的响应数据。
4.属性:
onreadystatechange 存储函数(或函数名),每当 readyState 属性改变时,就会调用该
函数。
readyState
存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成,且响应已就绪
status
200: "OK"
404: 未找到页面
callback 函数是一种以参数形式传递给另一个函数的函数。
5、ajax所包含的技术
大家都知道ajax并非一种新的技术,而是几种原有技术的结合体。它由下列技术组合而成。
1.使用CSS和XHTML来表示。
2. 使用DOM模型来交互和动态显示。
3.使用XMLHttpRequest来和服务器进行异步通信。
4.使用javascript来绑定和调用。
6.Ajax的给我们带来的好处大家基本上都深有体会,在这里我只简单的讲几点:
1、最大的一点是页面无刷新,在页面内与服务器通信,给用户的体验非常好。
2、使用异步方式与服务器通信,不需要打断用户的操作,具有更加迅速的响应能力。
3、可以把以前一些服务器负担的工作转嫁到客户端,利用客户端闲置的能力来处理,减轻服
务器和带宽的负担,节约空间和宽带租用成本。并且减轻服务器的负担,ajax的原则是“按需取
数据”,可以最大程度的减少冗余请求,和响应对服务器造成的负担。
4、基于标准化的并被广泛支持的技术,不需要下载插件或者小程序。
7、ajax的缺点
1、ajax干掉了back按钮
实例:
function loadXMLDoc(url) {
var xmlhttp;
var txt, x, xx, i;
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else {// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
txt = "<table border='1'><tr><th>Title</th><th>Artist</th></tr>";
x = xmlhttp.responseXML.documentElement.getElementsByTagName("CD");
for (i = 0; i < x.length; i++) {
txt = txt + "<tr>";
xx = x[i].getElementsByTagName("TITLE");
{
try {
txt = txt + "<td>" + xx[0].firstChild.nodeValue +
"</td>";
}
catch (er) {
txt = txt + "<td> </td>";
}
}
xx = x[i].getElementsByTagName("ARTIST");
{
try {
txt = txt + "<td>" + xx[0].firstChild.nodeValue +
"</td>";
}
catch (er) {
txt = txt + "<td> </td>";
}
}
txt = txt + "</tr>";
}
txt = txt + "</table>";
document.getElementById('txtCDInfo').innerHTML = txt;
}
}
xmlhttp.open("GET", url, true);
xmlhttp.send();
}
/* htnl 实例*/
<html>
<head>
</head>
<body>
<div id="txtCDInfo">
<buton onclick="loadXMLDoc('/example/xmle/cd_catalog.xml')">获得 CD 信息</button>
</div>
</body>
</html>
AJAX 基础知识的更多相关文章
- Ajax基础知识《一》
对于网站开发人员,一定不会陌生的Ajax技术,本篇就让我们认识一下它,或许在日后的开发过程中我们就可以使用到.Ajax在那方面使用的比较多呢?答案:表单注册,传统的表单注册,有时需要填写大量的信息,当 ...
- Ajax基础知识(二)
接上一篇 Ajax基础知识(一) 在上一篇博客里,抛弃了VS中新建aspx页面,拖个button写上C#代码的方式.使用ajax的方式,异步向服务器请求数据.我们让服务器只简单的返回一个" ...
- Ajax基础知识 浅析(含php基础语法知识)
1.php基础语法 后缀名为.php的文件 (1) echo 向页面中输入字符串 <?php 所有php相关代码都要写在<?php ?>这个标签之中 echo &q ...
- 11月10日上午ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库
1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...
- ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库
1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...
- 14.ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库
1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...
- Ajax基础知识(一)
随便在百度谷歌上输入Ajax都会出现一大堆的搜索结果,这已经不再是什么新奇的技术了.但若从一开始就学习了ASP.Net,使用功能齐全的Visual Studio集成开发工具,或许未必能对访问一个动态网 ...
- Json,Gson,Ajax基础知识
//json 是一种轻量级的文本格式,解析简单,他也是一键值来存,数据与数据的分割是以,来分割 //{} 看到大括号就是一个对象,[]代表集合 ,基本上所有数据的交互都是以json格式来进行传递的 / ...
- ajax基础知识
一个简单的ajax例子: Uncaught SyntaxError: Unexpected token input看看是否是漏了:或者函数没有() //更新单个简历完整度 function updat ...
随机推荐
- linux下 yum源、rpm、源代码安装mysql
mysql的安装 一.yum源格式安装mysql 1.将下载的yum包上传到linux上: [root@localhost ~]# ls mysql-community-release-el6-5.n ...
- oracle中的sql%rowcount
sql%rowcount用于记录修改的条数,就如你在sqlplus下执行delete from之后提示已删除xx行一样,这个参数必须要在一个修改语句和commit之间放置,否则你就得不到正确的修改行数 ...
- [改善Java代码]覆写equals方法必须覆写hashCode方法
覆写equals方法必须覆写hashCode方法,这条规则基本上每个Javaer都知道,这也是JDK API上反复说明的,不过为什么要这样做呢?这两个方法之间有什么关系呢?本建议就来解释该问题,我们先 ...
- hdu 4251 划分树
思路:裸的划分树 #include<iostream> #include<algorithm> #include<cstdio> #include<cmath ...
- OpenShare vs Sharepoint
光合信息Openshare是基于SharePoint,Exchange等开发的企业协同门户产品,许多朋友问为什么不直接就用Sharepoint建立企业门户解决方案,而要建议用OpenShare来进行? ...
- EF 实体+ Newtonsoft.Json 输出JSON 时动态忽略属性的解决方法
最近的项目采用的是 ASP.NET mvc 4.0 + entity framework 5.0 ,后台以JSON形式抛出数据是借助于Newtonsoft.Json , 要想忽略的属性前面添加特性 ...
- js中关于事件处理函数名后面是否带括号的问题
今天总结一个关于事件处理程序的小细节.首先回顾一下事件处理的一些概念. JS中的事件处理(事件绑定)就是让某种或某些事件触发某些活动.有两种常见的形式,分别是DOM Level 0 和DOM Leve ...
- JS轮播图
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- 【Knockout】二、监控属性Observables
MVVM和viewModel Knockout是建立在以下三大核心功能之上的: 监控属性和依赖跟踪(Observables and dependency tracking) 声明式绑定(Declara ...
- android application类的用法
android application类的用法 Application是android系统Framework提供的一个组件,它是单例模式(singleton),即每个应用只有一个实例,用来存储系统的一 ...