欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Ajax简单程序-访问本地资源

程序员文章站 2022-05-28 08:32:25
...
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>Ajax</title>
    
    <script>
        var xmlHttp;                            // 保存XMLHttpRequest对象

        /* 如果明确是哪个内核则指定一个就够了,但是最好加上 */
        function createXMLHttp() {
            
            if (window.XMLHttpRequest) {        // 使用的是Firefox内核
                xmlHttp = new XMLHttpRequest();
            }
            else {                              // IE内核
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
        }
        function showMessage() {                // 调用类
            createXMLHttp();                    // 创建内核

            // 获取回调函数,注意没有()代表加载完成后再调用,加上了就是直接调用
            xmlHttp.onreadystatechange = showMessageCallback;
            
            // 需要访问的资源,注意路径问题,desti.html是和我的ajax程序在同一个目录下
            xmlHttp.open("POST", "desti.html");
            xmlHttp.send(null);                 // 发送请求
            
        }
        function showMessageCallback() {        // 回调函数
            if (xmlHttp.readyState == 4) {      // 状态码4代表发送成功并处理完成
                if (xmlHttp.status == 200) {    // 状态码200说明处理成功
                    
                    // 获取desti.html的内容
                    var info = xmlHttp.responseText;
                    // 使用文档对象设置消息的显示 
					document.getElementById("msg").innerHTML = info;
                }
            }
        }
    </script>
</head>
<body>
    <!-- Ajax提交按钮,onclick为鼠标点击的时候调用showMessage() -->
    <!-- span用与显示ajax获取的内容 -->
    <input type="button" value="getAjax" onclick="showMessage()">
    <span id="msg"></span>                      
</body>
</html>
    *运行结果:

Ajax简单程序-访问本地资源

  

  *注意异域访问问题也就是没有显示请参考:http://blog.csdn.net/sinat_34104446/article/details/79652599