
* 겪고 있는 문제 상황을 최대한 자세하게 작성해주세요.
* 문제 해결을 위해 어떤 시도를 해보았는지 구체적으로 함께 알려주세요.
image url 바꾸는 방법 .attr()과 url 를 변수로 받아 temp_html ${url} 후 append() 하는 방법의 차이가 있는 지 장단점이 있는 지 궁금합니다.
전 수업시간 고양이 랜덤 사진 띄우기때 image url를 바꾸는 방법으로
$.ajax({
type: "GET",
url: "https://api.thecatapi.com/v1/images/search",
data: {},
success: function (response) {
let catimg = response[0]['url']
$('#img-cat').attr("src", catimg)
}
})
.attr() 를 활용했는 데 이번 ajax총 복습 시간에는 url를 변수로 받아 다른 데이터들과 똑같이 temp_html 에 ${image}를 받았습니다.
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>`
// $('.card-img-top').attr("src", image )
$('#cards-box').append(temp_html);
}
