728x90
onreadyStateChange์ ๋ฑ๋ก๋ callback ํจ์๋ readyState๋ผ๋ ํ๋กํผํฐ์ ๊ฐ์ด ๋ณ๊ฒฝ๋ ๋๋ง๋ค ํธ์ถ๋๋ค.
์๋ฒ์์ ์๋ต์ด ์ฌ๋ function์ ์ํํ๊ณ ์ ํ ๊ฒฝ์ฐ
-์๋ฒ์์ ์๋ต์ด ์ฌ๋ ์ํํ function์ onreadyState์ ๋ฑ๋ก ํ ์ค์ ์๋ต์ด ์ค๋ฉด(readyState๊ฐ์ผ๋ก ํ๋จ)
๋ฑ๋กํ function์ ์คํํ๋ค.
-httpRequest.onreadystatechange=callbackFunction;
-์ค์ ์คํํ๋ function์์๋ ์ํ์ ๋ณํ๋ฅผ ๋ํ๋ด๋ readyState์ํ์ ๋ฐ๋ผ ์๋ต ์ฒ๋ฆฌ๋ฅผ ํ๋ค
httpRequest.readyState == 4 ๋ ๋ฐ์ดํฐ๋ฅผ ์ ๋ถ ๋ฐ์ ์ํ์ด๊ณ ์๋ฃ๋์๋ค๋ ๋ป์ด๊ณ
httpRequest.status == 200๋ ์๋ฒ๋ก๋ถํฐ ์๋ต์์ฒญ์ด ์ฑ๊ณตํ๋ค๋ ๋ป์ด๋ค.
์น์ฝํ ์ธ ์ text.txt ํ์ผ ์ถ๊ฐ๊ฐ ํ์ํ๋ค.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<p id="demo">p tag</p>
<button type="button" onclick="loadXMLDoc()">๋ด์ฉ๋ณ๊ฒฝ</button>
<script type="text/javascript">
let xhttp = new XMLHttpRequest(); //XML ํ์ผ ์ฝ๊ธฐ Request : ์์ฒญ
function loadXMLDoc(){
xhttp.onreadystatechange = function () {
//console.log( this.responseText ); //response : ์๋ต
//console.log(this.status);
//console.log(this.readyState);
if(this.readyState == 4 && this.status == 200){
document.getElementById("demo").innerHTML = this.responseText;
}
}
xhttp.open("GET", "test.txt", true);
console.log("xhttp.open");
xhttp.send();
console.log("xhttp.send");
}
/* readyState : ์งํ์ํ
0 -> open ๋ฉ์๋๋ฅผ ์ํํ๊ธฐ ์ ์ํ
1 -> loading ์ค..
2 -> loading ์๋ฃ
3 -> Server ์ฒ๋ฆฌ์ค
4 -> Server ์ฒ๋ฆฌ ์๋ฃ
status
200 -> success
403 -> ์ ๊ทผ ๊ธ์ง
404 -> ์์, ๋ชป์ฐพ๊ฒ ์
500 -> ๊ตฌ๋ฌธ์๋ฌ
*/
</script>
</body>
</html>
'๐ ์๋ฐ ์๋ฒ ํ์ด์ง JSP > ๐ธ ์ ์ด์จ XML\JSON' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
2๏ธโฃ ์ ์ด์จ JSON - ๋ฐ์ดํฐ ๊ฐ์ ธ์ค๊ธฐ (0) | 2021.03.09 |
---|---|
1๏ธโฃ ์ ์ด์จ JSON - ๊ธฐ๋ณธ 1 (0) | 2021.03.09 |
4๏ธโฃ XML - ์์ฉ (0) | 2021.03.09 |
3๏ธโฃ XML - ๋ฌธ์์ด ๋์ ๊ณผ ์ค์ XMLํ (0) | 2021.03.09 |
1๏ธโฃ XML - ๊ธฐ๋ณธ 1 (0) | 2021.03.09 |
๋๊ธ