let more = 0;
document.querySelector('#more').addEventListener('click', function(){
more++;
function cardCreate(){
data.forEach(function(a, i){
console.log(more);
var 템플릿 =
`<div class="col-sm-4">
<img src="https://via.placeholder.com/600" class="w-100">
<h5>${data[i].title}</h5>
<p>${data[i].price}</p>
</div>`;
document.querySelector('.row').insertAdjacentHTML('beforeend', 템플릿);
})
}
if(more == 1){
$.get('https://codingapple1.github.io/js/more1.json').done(function(data){
cardCreate();
})
}
if(more == 2){
$.get('https://codingapple1.github.io/js/more2.json').done(function(data){
data.forEach(function(a,i){
var 템플릿 =
`<div class="col-sm-4">
<img src="https://via.placeholder.com/600" class="w-100">
<h5>${data[i].title}</h5>
<p>${data[i].price}</p>
</div>`;
document.querySelector('.row').insertAdjacentHTML('beforeend', 템플릿);
document.querySelector('#more').style.display = 'none';
})
})
}
})
여기서 more가 1일경우에 cardCreate함수가 왜 실행이 안되는지 모르겠습니다..
함수를 안쓰면 정상적으로 출력됩니다
그리고 여기서 코드를 축약한다면 foreach함수부분만 함수화 하면 되는지 궁금합니다