본문 바로가기

스파르타 코딩 웹개발 종합반57

2-9 Quiz_Ajax 연습하기_ OpenAPI이용 (서울따릉이 현황) 실시간 따릉이 현황을 테이블 형식으로 아래 표에 추가. 완성코드 jQuery + Ajax의 조합을 연습하자! 2. 서울시 OpenAPI(실시간 따릉기 현황)를 이용하기 모든 위치의 따릉이 현황을 보여주세요 업데이트 버튼을 누를 때마다 지웠다 새로 씌여져야 합니다. 업데이트 거치대 위치 거치대 수 현재 거치된 따릉이 수 하면서 주의할 부분: 처음에 row를 출력할때 response를 쓰지 않았음 let rows = ['getStationList']['row'];(x) let rows = response['getStationList']['row']; (o) 반복문에서 for (let i = 0; i 2022. 5. 14.
2-8 Ajax 연습 _ jQuery + Ajax 조합 (+ if 조건문) 2-7에서 만든 Ajax jQuery 와 연결하기 jQuery+Ajax의 조합을 연습하자! 1. 서울시 OpenAPI(실시간 미세먼지 상태)를 이용하기 모든 구의 미세먼지를 표기해주세요 업데이트 버튼을 누를 때마다 지웠다 새로 씌여져야 합니다. 업데이트 + if 조건문 미세먼지 수치가 60이상인곳은 빨갛게 보이기 jQuery+Ajax의 조합을 연습하자! 1. 서울시 OpenAPI(실시간 미세먼지 상태)를 이용하기 모든 구의 미세먼지를 표기해주세요 업데이트 버튼을 누를 때마다 지웠다 새로 씌여져야 합니다. 업데이트 2022. 5. 14.
2-7 Ajax 시작하기 Ajax? ✔️ Asynchronous Javascript And XML 브라우저에서 엔터를 치는것과 같이 자바스크립트에서 서버를 요청하는것. Ajax는 jQuery를 임포트한 페이지에서만 동작 가능 : 그래서 jQuery가 임포트 되어있지 않은 http://google.com/ 과 같은 화면에서 개발자도구를 열면, Uncaught TypeError: $.ajax is not a function(ajax라는 게 없다)는 에러가 뜸. ✔️ 기본골격 $.ajax({ type: "GET", url: "여기에URL을입력", data: {}, success: function(response){ console.log(response) } }) 코드해설: type: "GET" GET 방식으로 요청한다. url: "".. 2022. 5. 14.
2-6 서버-클라이언트 통신 이해하기 _ JSON / JSONView /API JSON? JavaScript Object Notation 데이터를 저장하거나 전송할때 사용되는 Data교환 형식. Key:Value로 이루어져 있음 JSON view? JSON을 더 깔끔하게 볼 수 있게 해줌. 설치: https://chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmc?hl=ko JSONVue Validate and view JSON documents chrome.google.com API (요청 : 클라이언트→서버) API는 은행창구 같은것. 예) A 창구 : ‘아이디’를 가져와 그럼 주문내역을알려줄게 B 창구: 주소를 가져와 그럼 음식점을알려줄게 http://우리은행용산지점/입출금창구?신분증 ↑ ↑ ↑.. 2022. 5. 14.

티스토리툴바