210415-TIL

• 스파르타 코딩 클럽 - 웹개발 종합반 3주차 시작.

• 벌써 3주차인데도 불구하고 jQuery를 사용할 때는 class명이 아닌 id명으로 사용하여야 한다는 것을 자꾸 잊는다. 꼭 주의할 것.

<script>
        $(document).ready(function () {
            $('cards-box').empty();
            listing();
        });

        function listing() {
            $.ajax({
                type: "GET",
                url: "http://spartacodingclub.shop/post",
                data: {},
                success: function (response) {
                    let rows = response['articles'];
                    for (let i = 0; i < rows.length; i++) {
                        let comment = rows[i]['comment'];
                        let desc = rows[i]['desc'];
                        let image = rows[i]['image'];
                        let title = rows[i]['title'];
                        let url = rows[i]['url'];

                        let temp_html = `
                            <div class="card">
                                <img class="card-img-top" src=${image}
                                     alt="Card image cap">
                                <div class="card-body">
                                    <a href="${url}" class="card-title">${title}</a>
                                    <p class="card-text">${desc}</p>
                                    <p class="card-text comment">${comment}</p>
                                </div>
                            </div>`

                        $('#cards-box').append(temp_html);
                    }
                }
            })
        }
    </script>
    <div class="card-columns" id="cards-box">
<!--가짜 카드 내용 생략-->
    </div>

• 해당 부분에서 왜인지 empty 함수가 실행되어도 아직 카드가 남아있어서, 일단은 카드박스에 있는 내용을 직접 비우고 진행했다.
• 다시 보니 id명에 #을 또 안붙였다. 클래스 이름을 쓰는것 다음으로 자주하는 실수인데, 여기 쓴 만큼 다음부터는 더 깊게 주의해서 코딩할 것.