zoukankan      html  css  js  c++  java
  • 妙味——ajax(1)

    ajax请求:

      1、创建Ajax对象

      2、连接服务器

      3、发送请求

      4、接收返回值

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>Document</title>
    <script>
    window.onload=function(){
        var oBtn = document.getElementById('btn1');
    
        oBtn.onclick=function(){
            // 1、创建Ajax对象    XMLHttpRequest在IE6下用不了
            // var oAjax = new XMLHttpRequest();
            // alert(oAjax);
    
            // IE6
            // var oAjax = new ActiveXObject('Microsoft.XMLHTTP');
            // alert(oAjax);
    
            var oAjax=null;
            if(window.ActiveXObject){
                oAjax = new ActiveXObject('Microsoft.XMLHTTP');
            }
            else{
                oAjax = new XMLHttpRequest();
            }
    
    
            //2、链接服务器
            // open(方法,url,是否是异步)
            oAjax.open('GET', 'aaa.txt', true);
    
            //3、发送请求
            oAjax.send();
    
            // 4、接收返回
            oAjax.onreadystatechange=function(){
                // alert(oAjax.onreadyState);
                if(oAjax.readyState==4){
                    // alert(oAjax.status);
                    if(oAjax.status=200){
                        alert('成功'+oAjax.responseText);
                    }
                    else{
                        alert('失败');
                    }
                }
            };
    
            /*
            onreadystatechange事件
                readyState属性:请求状态
                    0:(未初始化)还没有调用open()方法
                    1:(载入)已调用send()方法,正在发送请求
                    2:(载入完成)send()方法完成,已收到全部响应内容
                    3:(解析)正在解析响应内容
                    4:(完成)响应内容解析完成,可以在客户端调用了
                status属性:请求结果
            */
        };
    };
    </script>
    </head>
    <body>
        <input type="button" value="读取文件" id="btn1" />
    </body>
    </html>
    高否?富否?帅否? 否? 滚去学习!
  • 相关阅读:
    .htaccess的基本用法与介绍
    SEO之如何做301转向
    HTML的display属性将行内元素、块状元素、行内块状元素互相转换以及三者的区别
    web前端利用HTML代码显示符号
    Day 54 Django_模型层_用户认证&中间件
    Day 53 Django_模型层_forms组件$cookie与session
    Day 52 Django_模型层_Ajax&分页器
    Day 51 Django_模型层_多表操作
    Day 50 Django_模型层_ORM&单表操作
    Day 49 Django_模板层
  • 原文地址:https://www.cnblogs.com/baixc/p/3474827.html
Copyright © 2011-2022 走看看