zoukankan      html  css  js  c++  java
  • ajax

    1.1ajax介绍

    asynchronous:异步

    异步,同步相对立的一对概念;

    javascript;

    and

    xml( extensionable markup language),可扩展标记语言

    异步的javascript和xml技术

    1.2xml介绍

    xml是介于html和xtml之间的产物,用来解决早起传输数据时的,格式的问题。

    xml和html最根本的区别:xml标签可扩展,用户自己定义,html标签是固定的

    xml是用来传输数据的 ,html是用来显示数据的;

    1.3应用场景

    1.注册用户时,用户输入完毕需要从数据库查询是否存在提示;

    2.百度输入框输入,从服务器查询相似信息;

    1.4ajax对象的床架

    说明:js通过XMLHttpRqquest对象和服务器搭线,进行交互

    该对象的创建都是通过:new  XMLHttpRqquest对象创建

    //创建ajax对象,对象调用成员实现对服务器的请求
    //    //① 创建对象
    //    var xhr = new XMLHttpRequest();
    //
    //    //监听ajax状态
    //    xhr.onreadystatechange = function(){
    //        if(xhr.readyState==4){
    //            //alert(xhr.responseText);
    //            document.getElementsByTagName('input')[0].value = xhr.responseText
    //            //document.body.innerHTML += xhr.responseText;
    //        }
    //    }
    //
    //    //② 创建一个新的http请求(打开浏览器,输入请求地址)
    //    //xhr.open(请求方式get/post,请求地址[,异步同步请求]);
    //    xhr.open("get",'./index.php?uid=123');
    //
    //    //③ 发送请求
    //    //xhr.send(post请求数据 / get请求设置null);
    //    xhr.send(null);
    }

     ajax对象的成员
            属性:
                responseText 以字符串形式接收服务器端返回的信息
                readyState   表示ajax状态值
                onreadystatechange  事件,该事件可以感知ajax状态(readyState)的变化
                                    ajax请求过程中要随时感知其状态
            方法:
                open()创建一个新的http请求
                send()发送请求到服务器

            ajax有5种状态readyState:
            0------> 创建ajax对象完毕
            1------> 有调用open()方法
            2------> 有调用send()方法
            3------> 服务器端数据只返回了一部分
            4------> 服务器端数据全部返回,ajax请求完成

            
            */
    //        function f1(){
    //            var xhr = new XMLHttpRequest();
    //            
    //            //设置事件onreadystatechange 感知ajax状态变化
    //            xhr.onreadystatechange = function(){
    //                if(xhr.readyState==4){
    ////                    alert(xhr.responseText);
    //                    document.body.innerHTML += xhr.responseText;
    //                }
    //            }
    //
    //            xhr.open('get','./03.php');
    //
    //            xhr.send(null);
    //        }

  • 相关阅读:
    php程序员面试经验
    模板引擎(smarty)知识点总结五
    模板引擎(smarty)知识点总结三
    js计算字数
    phpexcel导出成绩表
    phpexcel用法(转)
    模板引擎(smarty)知识点总结
    apache泛域名解析
    对象的解构赋值
    解构赋值
  • 原文地址:https://www.cnblogs.com/zuichumx0826/p/9013030.html
Copyright © 2011-2022 走看看