Localhost:8888 연결 응용
0. javascript 파일에서 코드 작성
1. javascript 파일에서 [Ctrl+`]로 터미널 호출 후 연결
ctrl+` >
C:\>cd "Program Files"
C:\Program Files>cd nodejs
C:\Program Files\nodejs>node C:\firstnode.js
***참고로 'C:\firstnode.js '는 파일 경로
2. html 파일 생성 후 코드 작성
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<title>Document</title>
</head>
<body>
Ajax Test
<button id="btn">getData()</button>
<select name="" id=""></select>
<script>
var dataArr = [];
var put = document.querySelector('select');
$(document).ready(function(){
$('#btn').click(function(){ //버튼을 클릭하면 function실행
$.ajax({
url:"http://localhost:8888"
}).success(function(data){ //성공하면
// 0.select에 data넣기_createElement, createTextNode, appendChild 사용
// dataArr = data.split(",");
// for(var i=0; i<dataArr.length; i++){
// var sport = document.createElement("option");
// var sportlist = document.createTextNode(dataArr[i]);
// sport.appendChild(sportlist);
// document.querySelector("select").appendChild(sport);
// }
// 1.select에 data넣기_innerHTML 사용
dataArr=data.split(",");
for(var i=0; i<dataArr.length; i++){
put.innerHTML+="<option>"+dataArr[i]+"</option>";
}
});
})
})
</script>
</body>
</html>
| cs |
3. 결과
