5.2、ajax封装版

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <!--[if lte IE7]> <script src='./json2.js'></script><!endif-->
    <!-- 这个不是注释  而是判断浏览器是大于IE7 时不加载  小于等于IE7时加载-->
</head>

<body>
    <script>
        function ajax(url, success, error) {
            //姜蓉IE6并创建ajax对象
            var xhr = null
            if (window.XMLHttpRequest) {
                xhr = new XMLHttpRequest()
            } else {
                xhr = new ActiveXObject('Microsoft.XMLHTTP')
            }
            // 第二步 调用open  方法
            xhr.open('get', url, true)

            // 第三步
            xhr.send()

            // 第四步 监听事件
            xhr.onreadystatechange = function() {
                //监听ajax状态
                if (xhr.readyState === 4) {
                    //监听服务器状态
                    if (xhr.status === 200) {
                        // 成功就把结果作为参数传出去
                        success && success(xhr.responseText)
                    } else {
                        // 失败就把失败的状态码传出去
                        error && error(xhr.status)
                    }
                }
            }
        }

        // 使用
        ajax(url, function(date) {
            // 注意这个date打印出来是个字符串类型的
            // 要使用必转通过JSON.parse()转换成对象
            // JSON.parse()和JSON.stringify() IE7及以下 不兼容  业界有个专门兼容这两个方法的文件 叫 json2.js
            console.log(JSON.parse(date))
        }, function(error) {
            console.log(error)
        })
    </script>
</body>

</html>

你可能感兴趣的:(javascript)