Ajax基础讲解 1

随着web的不断发展,Ajax的运用越来越普及,但是对很多同学来说Ajax稍微有些难懂,今天呢就简单给大家讲解一下Ajax的一些基础入门的知识,希望可以帮到刚学习Ajax的同学。

第一步:首先就是服务器的搭建,关于服务器呢不同的人有不同的需求,刚学的人就不要考虑到底用哪个服务器好了,根据每个人的技术不同服务器也不同,新手就随便弄一个可以用的就可以了,我用的是WampServer这个,比较好安装,用于自己写的页面足够了,没有服务器的同学如果想用,可以在下面给我留言,我看到会给你发送过去的;(另外多啰嗦几句,在开服务器之前尽量把迅雷啊或者播放器等占用宽带端口的软件关掉,以免冲突)

第二步:服务器装好了呢,就要进行我们的第一个Ajax程序的编写了,如下代码:

<script>
    /*
    第一步我们要知道不是任何一个浏览器都支持Ajax程序的,但是大部分还是支持的,所以呢我们要做一个判断并且做一个兼容;
    */
    //创建对象
    var oAjax = new XMLHttpRequest;//这个属性是不加载刷新;
        //判断是否支持XMLTttpRequset这个属性
          if(Window. XMLHttpRequest){
            //如果支持有,直接可以使用
         }else{
           //如果没有那么就要调用插件了
           oAjax = new ActiveXobjest(‘Microsoft.XMLHTTP‘)/*ActiveXobjest这个是一个插件IE6在做的时候没有直接放到内核但却缺把他做成了插件放到了里面,所以调用时可以直接调用的到*/
         oAjax.open(‘GET‘,url,true)//这个呢就是比喻是拨号,要什么号码什么目标一样里面要放
        oAjax.send()//这个呢是向服务器发送请求的方法;
       //最后呢就是要获取服务器的内容了;
        oAjax.onreadystatechange = function(){    //onreadystatechange 存储函数(或函数名),
					if(oAjax.readyState == 4){ /* XMLHttpRequest 有五种状    态。从 0 到 4 发生变化。0: 请求未初始化 1: 服务器连接已建立 2: 请求已接收 3: 请求处理中 4: 请求已完成,且响应已就绪 ;*/
                                                  //判断是否找到数据;
                                                 if(oAjax.status ==200){    //ok找到了
				                      alert(oAjax.responseText);//弹出获得字符串形式的响应数据。

			                         }else{       //失败
			                        	alert(失败了‘)
					            }
				}

        }

</script>

  

时间: 2024-10-09 05:54:25

Ajax基础讲解 1的相关文章

原生AJAX基础讲解及兼容处理

原文:原生AJAX基础讲解及兼容处理 AJAX = Asynchronous JavaScript and XML (异步的JavaScript和XML). AJAX不是新技术 ,但却是热门的技术.它可以在不重载(刷新)整个页面的情况下与服务器进行数据交互并更新网页模块. AJAX的优点有很多:可以局部刷新.按需加载,这样就减轻了服务器的数据流量.并且在页面更新的同时,用户可以浏览器网页的其它内容而不受影响,也减轻了结构负担.AJAX也不是万能的,在有以上优点的同时SEO也受到了影响. 在学习A

【javascript】ajax 基础 --本文转载

[javascript]ajax 基础 什么是 ajax ajax 即"Asynchronous JavaScript and XML"(异步 JavaScript 和 XML),也就是无刷新数据读取. http 请求 首先需要了解 http 请求的方法(GET 和 POST). GET 用于获取数据.GET 是在 URL 中传递数据,它的安全性低,容量低. POST 用于上传数据.POST 安全性一般,容量几乎无限. ajax 请求 ajax 请求一般分成 4 个步骤. 1.创建 a

JavaScript继承基础讲解,原型链、借用构造函数、混合模式、原型式继承、寄生式继承、寄生组合式继承

说好的讲解JavaScript继承,可是迟迟到现在讲解.废话不多说,直接进入正题. 既然你想了解继承,证明你对JavaScript面向对象已经有一定的了解,如还有什么不理解的可以参考<面向对象JS基础讲解,工厂模式.构造函数模式.原型模式.混合模式.动态原型模式>,接下来讲一般通过那些方法完成JavaScript的继承. 原型链 JavaScript中实现继承最简单的方式就是使用原型链,将子类型的原型指向父类型的实例即可,即“子类型.prototype = new 父类型();”,实现方法如下

基于JS的DOM 编程基础和Json语法及JS下的AJAX基础

1.在dom编程中:     注意:使用dom操作一般在页面完全载入之后,一般在window_onload事件里操作dom nodeName  表示节点的名称如:<input   type= "button"  value="确定" />    此时nodeName=“input” ; nodeValue  表示节点的值如<p>aaa</p> 此时的nodeValue="aaa",而nodeName="

原生ajax基础知识笔记

原生ajax基础知识笔记 1.创建 XMLHttpRequest 对象 所有现代浏览器(IE7+.Firefox.Chrome.Safari 以及 Opera)均内建 XMLHttpRequest 对象. 老版本的 Internet Explorer (IE5 和 IE6)使用 ActiveXObject. 代码示例: // Creates a XMLHttpRequest object. var xhr = new XMLHttpRequest(); 兼容浏览器代码示例: var xhr; /

AJAX 基础知识

AJAX 基础知识 一.AJAX综述 1.AJAX的概念 A:异步asynchronousJ:JavaScriptA:andX:XML 异步的JavaScript和XML. 2.AJAX的优点(好处) 1),提高用户体验度  2),JS与服务端的交互  3),页面局部刷新--提高浏览器的效率 2.AJAX的缺点(弊端)    加大服务器的负担 注:新思想,老技术. 二.实现AJAX功能 (一).JS实现AJAX功能 1.获得XMLHttpRequest(浏览器的兼容) (二).JQuery实现A

Ajax基础知识 浅析(含php基础语法知识)

1.php基础语法    后缀名为.php的文件 (1) echo   向页面中输入字符串  <?php    所有php相关代码都要写在<?php ?>这个标签之中 echo "<div>Hello World!</div>"; ?> (2) $  变量声明  如果只声明不赋值,会报错 <?php $num=123; echo $num; echo "<div>编号为:".$num."&l

【Java EE 学习第31天】【JavaScript基础增强】【Ajax基础】【Json基础】

一.JavaScript基础增强 1.弹窗 (1)使用window对象的showModelDialog方法和showModelessDialog方法分别可以弹出模式窗口和非模式窗口,但是只能在IE中使用,所以不推荐使用,最好使用open方法弹窗. (2)open方法. (3)open方法弹窗实例. Base.html文档: <!DOCTYPE html> <html> <head> <title>Base.html</title> <met

面向对象JS基础讲解,工厂模式、构造函数模式、原型模式、混合模式、动态原型模式

什么是面向对象?面向对象是一种思想!(废话). 面向对象可以把程序中的关键模块都视为对象,而模块拥有属性及方法.这样我们如果把一些属性及方法封装起来,日后使用将非常方便,也可以避免繁琐重复的工作.接下来将为大家讲解在JS中面向对象的实现. 工厂模式 工厂模式是软件工程领域一种广为人知的设计模式,而由于在ECMAScript中无法创建类,因此用函数封装以特定接口创建对象.其实现方法非常简单,也就是在函数内创建一个对象,给对象赋予属性及方法再将对象返回即可. function createBlog(