
처음 같이 했던 스파르타 피디아로 방금 질문드렸던거 연습중이었습니다.
'버튼 한개를 누르면 항목 추가/삭제' 기능을 구현하고 있씁니다,,
그래서 append 명령으로 할려고
<div class="wrap">
<button id="btn">dsa</button>
<div id="card-box" class="row row-cols-1 row-cols-md-3 g-4">
<div class="col" id="box">
<div class="card">
<img src="https://movie-phinf.pstatic.net/20210728_221/1627440327667GyoYj_JPEG/movie_image.jpg"
class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">여기에 제목이 들어갑니다.</h5>
<p class="card-text">여기에 내용이 들어가지요.</p>
<p>⭐⭐⭐</p>
<p class="mycomment">여기에 코멘트가 들어갑니다.</p>
</div>
</div>
</div>
</div>
---------------------------------------여기까지가 함수 전 원래 코딩 내용-----------------------------------
여기서 항목 한개 추가하기 위해서 '큰 그룹에서 하나'를 위해서
큰 그룹 ID ="card-box"
항목 한개 ID ="box"로 지정했습니다.
그리고 명령을 수행할 버튼은 id="btn"으로 지정했습니다
<script>
function q1() {
let txt = $('#card-box').val()
let temp_html = `<div class="col" id="box">
<div class="card">
<img src="https://movie-phinf.pstatic.net/20210728_221/1627440327667GyoYj_JPEG/movie_image.jpg"
class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">여기에 제목이 들어갑니다.</h5>
<p class="card-text">여기에 내용이 들어가지요.</p>
<p>⭐⭐⭐</p>
<p class="mycomment">여기에 코멘트가 들어갑니다.</p>
</div>
</div>
</div>
if ( ())
$('box').append(temp_html)
// 버튼.on("click", function () {
// console.log("버튼 클릭")
// })
}
</script>
---------------------------------대충 코드 짜놓은?-----
이렇게 대략 설정해보고
튜터님께서 말씀해주신 버튼.on("click", function () { console.log("버튼 클릭") }) 수행하려는데
1. function다음 함수에서 수업에서는 let txt로만 했는데 회색글씨로 비활성화되어서,,,, 이러한 div?는 어떤 식으로 적어야 하는지
2. 이렇게 ID 넣는게 맞는지
3. 버튼으로 추가 삭제하려면 if 문을 이용해서 btn버튼누르면 수정/ btn2버튼누르면 삭제 로 설정하는게 맞는지
그리고 if부터는 어떻게 써야할지 감이 안잡힙니다 구글링을 해봐도요,,,,
조금 번거로우시겠지만 자세한 답변좀 부탁드려도 될까요?? ㅜㅜ
