使用XMLHttpRequest对象与服务器通信

使用XMLHttpRequest对象与服务器通信

1. 创建 XMLHttpRequest 对象
 2. 配置请求方法和请求 url 地址
 3. 监听 loadend 事件，接收响应结果
  4. 发起请求
    

//1. 创建 XMLHttpRequest 对象
      const xhr = new XMLHttpRequest()
      // 2. 配置请求方法和请求 url 地址,method大小写都可以
      xhr.open('GET', 'http://hmajax.itheima.net/api/province')
      //3.监听 loadend 事件(loadend无论成功失败都会执行回调函数)，接收响应结果
      xhr.addEventListener('loadend', () => {
          console.log(xhr.response)
          //XHR返回的对象是JSON字符串，不会自动把JSON转化为JS对象
          //axios会自动把JSON转化为JS对象
          //parse方法可以把JSON转化为JS对象
          JSON.parse(xhr.response)
            //返回的data是一个对象
          const data = JSON.parse(xhr.response)
          //返回的是数组
          console.log(data.list)
          //数组转字符串
          consol.log(data.list.join('<br>'))

          document.querySelector('.my-p').innerHTML = data.list.join('<br>')
      })

      // 4. 发起请求
      xhr.send()