三、实现 （服务器打开）

1、原生js

<script>
        // 实现ajax的前提
        // html页面
        // 需要后端提供的数据接口
        // dom将获取的数据放到页面上
        var url = `http://127.0.0.1:5500/mock/index.json`
        //创建ajax的核心对象
        var xhr = new XMLHttpRequest();
        xhr.open('get', url, true)
        xhr.send();
        //onreadystatechange监听服务器状态的变化
         xhr.onreadystatechange = function () {
             //readystate值代表服务器响应的变化 ==4  请求完成，响应准备就绪   status==200  请求成功，数据成功的响应
                if (xhr.readyState == 4 && xhr.status == 200) {
                    console.log(xhr.responseText)
                    var res = JSON.parse(xhr.responseText)
                    console.log(res)
                }
            }
    </script>

2、jq

<script>
        var url = `http://127.0.0.1:5500/mock/index.json`
        $.ajax({
            url,
            success:res=>{
                console.log(res)
            }
        })
    </script>