커뮤니티
포인트
쿠폰
내 강의실
국비 신청 내역
증명서
계정
로그아웃
학습 질문
개발 일지
나의 활동
답변 완료
ajax 연습하기
undefined주차
북마크
김*오
댓글
1
・
추천
0
・
조회수
5
조회수
5
답변 완료
<!doctype html>
<html lang="ko">

<head>
    <meta charset="UTF-8">
    <title>jQuery 연습하고 가기!</title>

    <!-- jQuery를 import 합니다 -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

    <style type="text/css">
        div.question-box {
            margin: 10px 0 20px 0;
        }
        .bad {
            color: red;
        }
    </style>

    <script>
        function q1() {
            $.ajax({
                type: "GET",
                url: "http://spartacodingclub.shop/sparta_api/seoulair",
                data: {},
                success: function (response) {
                    console.log(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 > 120) {
                             temp_html = `<li class="bad">${gu_name} : $(gu_mise}</li>`
                        } else {
                             temp_html =`<li >${gu_name} : $(gu_mise}</li>`
                        }
                        $('#names-q1').append(temp_html)
                    }
                }
            })
        }
    </script>

</head>

<body>
    <h1>jQuery+Ajax의 조합을 연습하자!</h1>

    <hr />

    <div class="question-box">
        <h2>1. 서울시 OpenAPI(실시간 미세먼지 상태)를 이용하기</h2>
        <p>모든 구의 미세먼지를 표기해주세요</p>
        <p>업데이트 버튼을 누를 때마다 지웠다 새로 씌여져야 합니다.</p>
        <button onclick="q1()">업데이트</button>
        <ul id="names-q1">
            <li>중구 : 82</li>
            <li>종로구 : 87</li>
            <li>용산구 : 84</li>
            <li>은평구 : 82</li>
        </ul>
    </div>
</body>

</html>ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:27 Array(25)0: {ARPLT_MAIN: 'O3', CO: 0.4, IDEX_MVL: 31, IDEX_NM: '좋음', MSRDT: '201912052100', …}1: {ARPLT_MAIN: 'PM25', CO: 0.4, IDEX_MVL: 39, IDEX_NM: '좋음', MSRDT: '201912052100', …}2: {ARPLT_MAIN: '점검중', CO: 0.4, IDEX_MVL: -99, IDEX_NM: '점검중', MSRDT: '201912052100', …}3: {ARPLT_MAIN: 'PM10', CO: 0.5, IDEX_MVL: 42, IDEX_NM: '좋음', MSRDT: '201912052100', …}4: {ARPLT_MAIN: 'PM10', CO: 0.6, IDEX_MVL: 37, IDEX_NM: '좋음', MSRDT: '201912052100', …}5: {ARPLT_MAIN: 'NO2', CO: 0.5, IDEX_MVL: 36, IDEX_NM: '좋음', MSRDT: '201912052100', …}6: {ARPLT_MAIN: 'O3', CO: 0.6, IDEX_MVL: 31, IDEX_NM: '좋음', MSRDT: '201912052100', …}7: {ARPLT_MAIN: 'PM25', CO: 0.4, IDEX_MVL: 33, IDEX_NM: '좋음', MSRDT: '201912052100', …}8: {ARPLT_MAIN: 'PM10', CO: 0.4, IDEX_MVL: 34, IDEX_NM: '좋음', MSRDT: '201912052100', …}9: {ARPLT_MAIN: 'PM10', CO: 0.4, IDEX_MVL: 34, IDEX_NM: '좋음', MSRDT: '201912052100', …}10: {ARPLT_MAIN: 'PM10', CO: 0.5, IDEX_MVL: 37, IDEX_NM: '좋음', MSRDT: '201912052100', …}11: {ARPLT_MAIN: 'O3', CO: 0.3, IDEX_MVL: 41, IDEX_NM: '좋음', MSRDT: '201912052100', …}12: {ARPLT_MAIN: 'PM10', CO: 0.4, IDEX_MVL: 39, IDEX_NM: '좋음', MSRDT: '201912052100', …}13: {ARPLT_MAIN: 'PM25', CO: 0.4, IDEX_MVL: 36, IDEX_NM: '좋음', MSRDT: '201912052100', …}14: {ARPLT_MAIN: 'PM10', CO: 0.4, IDEX_MVL: 42, IDEX_NM: '좋음', MSRDT: '201912052100', …}15: {ARPLT_MAIN: 'O3', CO: 0.3, IDEX_MVL: 37, IDEX_NM: '좋음', MSRDT: '201912052100', …}16: {ARPLT_MAIN: 'PM10', CO: 0.4, IDEX_MVL: 41, IDEX_NM: '좋음', MSRDT: '201912052100', …}17: {ARPLT_MAIN: 'PM10', CO: 0.4, IDEX_MVL: 41, IDEX_NM: '좋음', MSRDT: '201912052100', …}18: {ARPLT_MAIN: 'NO2', CO: 0.4, IDEX_MVL: 37, IDEX_NM: '좋음', MSRDT: '201912052100', …}19: {ARPLT_MAIN: 'PM25', CO: 0.4, IDEX_MVL: 43, IDEX_NM: '좋음', MSRDT: '201912052100', …}20: {ARPLT_MAIN: '점검중', CO: 0.4, IDEX_MVL: -99, IDEX_NM: '점검중', MSRDT: '201912052100', …}21: {ARPLT_MAIN: 'PM10', CO: 0.4, IDEX_MVL: 39, IDEX_NM: '좋음', MSRDT: '201912052100', …}22: {ARPLT_MAIN: 'PM10', CO: 0.3, IDEX_MVL: 41, IDEX_NM: '좋음', MSRDT: '201912052100', …}23: {ARPLT_MAIN: 'NO2', CO: 0.4, IDEX_MVL: 42, IDEX_NM: '좋음', MSRDT: '201912052100', …}24: {ARPLT_MAIN: 'PM25', CO: 0.4, IDEX_MVL: 39, IDEX_NM: '좋음', MSRDT: '201912052100', …}length: 25[[Prototype]]: Array(0)
ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:28 Uncaught ReferenceError: rows is not defined
    at Object.success (ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:28:41)
    at c (jquery.min.js:2:27742)
    at Object.fireWith [as resolveWith] (jquery.min.js:2:28487)
    at l (jquery.min.js:2:78789)
    at XMLHttpRequest.<anonymous> (jquery.min.js:2:81117)
ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:27 Array(25)
ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:28 Uncaught ReferenceError: rows is not defined
    at Object.success (ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:28:41)
    at c (jquery.min.js:2:27742)
    at Object.fireWith [as resolveWith] (jquery.min.js:2:28487)
    at l (jquery.min.js:2:78789)
    at XMLHttpRequest.<anonymous> (jquery.min.js:2:81117)
ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:27 (25) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:28 Uncaught ReferenceError: rows is not defined
    at Object.success (ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:28:41)
    at c (jquery.min.js:2:27742)
    at Object.fireWith [as resolveWith] (jquery.min.js:2:28487)
    at l (jquery.min.js:2:78789)
    at XMLHttpRequest.<anonymous> (jquery.min.js:2:81117)
success @ ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:28
c @ jquery.min.js:2
fireWith @ jquery.min.js:2
l @ jquery.min.js:2
(anonymous) @ jquery.min.js:2
load (async)
send @ jquery.min.js:2
ajax @ jquery.min.js:2
q1 @ ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:22
onclick @ ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:56
ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:27 (25) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:28 Uncaught ReferenceError: rows is not defined
    at Object.success (ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:28:41)
    at c (jquery.min.js:2:27742)
    at Object.fireWith [as resolveWith] (jquery.min.js:2:28487)
    at l (jquery.min.js:2:78789)
    at XMLHttpRequest.<anonymous> (jquery.min.js:2:81117)
success @ ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:28
c @ jquery.min.js:2
fireWith @ jquery.min.js:2
l @ jquery.min.js:2
(anonymous) @ jquery.min.js:2
load (async)
send @ jquery.min.js:2
ajax @ jquery.min.js:2
q1 @ ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:22
onclick @ ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:56
ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:27 (25) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:28 Uncaught ReferenceError: rows is not defined
    at Object.success (ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:28:41)
    at c (jquery.min.js:2:27742)
    at Object.fireWith [as resolveWith] (jquery.min.js:2:28487)
    at l (jquery.min.js:2:78789)
    at XMLHttpRequest.<anonymous> (jquery.min.js:2:81117)
success @ ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:28
c @ jquery.min.js:2
fireWith @ jquery.min.js:2
l @ jquery.min.js:2
(anonymous) @ jquery.min.js:2
load (async)
send @ jquery.min.js:2
ajax @ jquery.min.js:2
q1 @ ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:22
onclick @ ajax01.html?_ijt=6leird7ciherf91ptpoth5nclj&_ij_reload=RELOAD_ON_SAVE:56

ㅇ업데이트를 계속누르니 이렇게 표시되는데, 어디가 잘못됐읍니까~~~
취소
 공유
취소
댓글 0
댓글 알림
나의얼굴