스파르타 코딩클럽 웹개발 종합반 2주차 개발일지!

JQuery란?

HTML의 요소들을 조작하는, 편리한 Javascript를 미리 작성해둔 것을 말하며 코드가 복잡하고 호환성문제에 어려움이있는 Javascript를 대신해서 나온 라이브러리.

<script>
        function openclose() {
            let status = $('#post-box').css('display');
            if (status == 'block') {
                $('#post-box').hide()
                $('#posting-box-btn').text('포스팅박스 열기')
            } else {
                $('#post-box').show()
                $('#posting-box-btn').text('포스팅박스 닫기')
            }
        }
    </script>

포스팅박스를 적용한 모습

버튼을 누르면 포스팅박스가 열고 닫히는 모습을 확인할수 있다.

Ajax

Ajax는 jQuery를 임포트한 페이지에서만 동작 가능

$.ajax({
  type: "GET", // GET 방식으로 요청한다.
  url: "http://openapi.seoul.go.kr:8088/6d4d776b466c656533356a4b4b5872/json/RealtimeCityAir/1/99",
  data: {}, // 요청하면서 함께 줄 데이터 (GET 요청시엔 비워두세요)
  success: function(response){ // 서버에서 준 결과를 response라는 변수에 담음
    console.log(response) // 서버에서 준 결과를 이용해서 나머지 코드를 작성
  }
})

Ajax코드를 이용해 미세먼지값을 출력하는 실습과정

2주차 HOMEWORK