1.get请求提交参数
1.实例化一个请求对象
2.调用open方法,设置请求方式和请求地址
3.设置请求完成后到回调函数
4.调用send方法,完成请求
get传递参数
语法: url? key = value
url? key1 = value1&key2 = value2&key3 = value3
<script>
// 1.实例化一个请求对象
let xhr = new XMLHttpRequest
// 2.调用open方法,设置请求方式和请求地址
xhr.open('get','https://autumnfish.cn/api/joke/list?num=10')
// 3.设置请求完成后到回调函数
xhr.onload = function(){
// console.log(xhr.response);
// xhr.response是服务器响应回来的内容
// JSON.parse方法是将响应回来的JSON对象转为普通的JS对象
let jokes = JSON.parse(xhr.response)
console.log(jokes);
}
// 4.调用send方法,完成请求
xhr.send()
</script>
2.AJAX发送post请求
1.实例化一个请求对象
2.调用open方法,传递请求方法及请求地址
3.设置请求头
4.设置请求成功后回调函数
5.发送请求
get请求传递参数:直接在url地址后拼接,安全性不高
post请求传递参数:在send()方法里传递
<script>
// 1.实例化一个请求对象
let xhr = new XMLHttpRequest
// 2.调用open方法,传递请求方法及请求地址
xhr.open('post','https://autumnfish.cn/api/user/register')
// 3.设置请求头
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded")
// 4.设置请求成功后回调函数
xhr.onload = function() {
// console.log(xhr.response);
let obj = JSON.parse(xhr.response)
console.log(obj);
}
// 5.发送请求
// 请求格式 :'key= value'
xhr.send('username=nana')
</script>