ajax簡單用法
阿新 • • 發佈:2021-08-02
請求端
<body> <div> hello world</div> <input type="button" value="ajax"> </body> <style> div { width: 200px; height: 300px; border: aquamarine 1px solid; } </style> <script> let bt = document.querySelector("input"); let mydiv = document.querySelector("div"); bt.onclick = function () { let xhr = new XMLHttpRequest(); console.log(xhr.readyState); xhr.open("get", "http://localhost:8000/"); console.log(xhr.readyState); xhr.send(); xhr.onreadystatechange = function () { if (xhr.readyState === 4) { if (xhr.status >= 200 && xhr.status <= 300) { console.log("success"); console.log(xhr.status); console.log(xhr.readyState); console.log(xhr.statusText); console.log(xhr.response); console.log(xhr.getAllResponseHeaders()); mydiv.innerHTML = xhr.response; } } } } </script>
伺服器端
let express = require("express");
let app1 = express();
app1.get("/", (r, rs) => {
rs.setHeader("Access-Control-Allow-Origin", "*")
rs.send("收到")
})
app1.listen(8000, () => {
console.log(
"8000伺服器啟動"
);
})