2-9 ajax 연습하기

    <script>
        function q1() {
           $('#names-q1').empty()
            $.ajax({
                type: "GET",
                url: "http://openapi.seoul.go.kr:8088/6d4d776b466c656533356a4b4b5872/json/RealtimeCityAir/1/99",
                data: {},
                success: function (response) {
                  let rows = response['RealtimeCityAir']['row']
                  for (let i = 0; i < rows.length; i++) {
                    let gu_name = rows[i]['MSRSTE_NM']
                    let gu_mise = rows[i]['IDEX_MVL']

                    let temp_html = ``
                    if (gu_mise > 70) {
                      temp_html = `<li class="bed">${gu_name} : ${gu_mise}</li>`
                    } else {
                      temp_html = `<li >${gu_name} : ${gu_mise}</li>`
                    }
                    $('#names-q1').append(temp_html)
                  }
                }
            })
        }
        // q1 함수로 ajax를 불러온다
        // ajax 콜을 하기 전에 새로고침을 하기위해서 지정한 값을 빈값으로 새로고침한다.
        // get 조회의 타입이고
        // 데이터를 가져올 url을 지정한다
        // 비어있는 데이터 값을 가져오려고한다.
        //리스판스 함수를 지정하고
        // 첫번째로 대제목을 가져온후 디테일한 값을 가져온다
        rows라는 값을 가져와서 리스판스에 데이터 realtimecityair 와 row값을 가져오도록한다.
        // for 반복문을 사용해서 한번씩 증가하도록 설정을 해놓고
        // for (let i가 0부터 rows의 .length만큼 ; i++) 하나씩 커진다.
        // 변수의 구 이름은 rows의 i열의 값을 지정하도록한다.
        // 변수추가될때 아래같이 사용한다.
        // append 는 추가하고 다시 위로 이동한다.
        

css 는 class로 지정 , javascript, Ajax는 = id 지정

temp_html 은 `` 백틱 사용 "**temp_html이 뭐지? 다시봐야함**"

새롭게 다시 적용할 때는 ajax 앞에 empty() 함수사용
추가할 때는 append (temp_html)사용

css 스타일에는 앞에 .(점) 추가 

css 클레스는 이렇게 표기 리스트 <li class="bed">