zoukankan      html  css  js  c++  java
  • AJAX例题(原生js实现ajax)

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script>
            
            //定义方法
            function  fun() {
                //发送异步请求
                //1.创建核心对象
                var xmlhttp;
                if (window.XMLHttpRequest)
                {// code for IE7+, Firefox, Chrome, Opera, Safari
                    xmlhttp=new XMLHttpRequest();
                }
                else
                {// code for IE6, IE5
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }
    
                //2. 建立连接
                /*
                    参数:
                        1. 请求方式:GET、POST
                            * get方式,请求参数在URL后边拼接。send方法为空参
                            * post方式,请求参数在send方法中定义
                        2. 请求的URL:
                        3. 同步或异步请求:true(异步)或 false(同步)
    
                 */
                xmlhttp.open("GET","ajaxServlet?username=tom",true);
    
                //3.发送请求
                xmlhttp.send();
    
                //4.接受并处理来自服务器的响应结果
                //获取方式 :xmlhttp.responseText
                //什么时候获取?当服务器响应成功后再获取
    
                //当xmlhttp对象的就绪状态改变时,触发事件onreadystatechange。
                xmlhttp.onreadystatechange=function()
                {
                    //判断readyState就绪状态是否为4,判断status响应状态码是否为200
                    if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    {
                       //获取服务器的响应结果
                        var responseText = xmlhttp.responseText;
                        alert(responseText);
                    }
                }
    
            }
            
        </script>
        
        
    </head>
    <body>
    
        <input type="button" value="发送异步请求" onclick="fun();">
    
        <input>
    </body>
    </html>
  • 相关阅读:
    vue --- 脚手架初始化项目中配置文件webpack.base.conf.js代码含义
    Chrome
    es8 --- 新特性
    es7 --- 新特性
    vue --- 关于多个router-view视图组件,渲染同一页面
    vue ---- 组件传值之间使用 v-model
    vue --- watch 高级用法
    js --- 递归结构图
    es6 --- Generator 函数
    es6 -- set 数据结构
  • 原文地址:https://www.cnblogs.com/wpy188/p/12416158.html
Copyright © 2011-2022 走看看