2-6 JQuery 연습하기 (2) | 스파르타 커뮤니티

커뮤니티

포인트

쿠폰

내 강의실

국비 신청 내역

증명서

계정

로그아웃

학습 질문

개발 일지

나의 활동

답변 완료

2-6 JQuery 연습하기 (2)

[GPT] 웹개발 종합반 v0

2주차

・

추천

・

조회수

답변 완료

* 겪고 있는 문제 상황을 최대한 자세하게 작성해주세요.

* 문제 해결을 위해 어떤 시도를 해보았는지 구체적으로 함께 알려주세요.

forEach에 element 를 넣는 이유가 뭔가요?

<!DOCTYPE html>
<html>
  <head>
    <title>자바스크립트 문법 연습하기!</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
  </head>


  <body>
    <div class="top-part">
      <h1>자바스크립트 문법 연습하기!</h1>
    </div>
    <hr />
    <br />
    <h2>1. 함수</h2>
    <div class="button-part">
      <button onclick="checkResult()">결과 확인하기!</button>
    </div>
    <div class="list-part">
      <h2>2. 붙이기</h2>
      <div id="q1">
        <p>사과</p>
        <p>귤</p>
        <p>감</p>
      </div>
    </div>
    <div class="list-part">
      <h2>3. 붙이기</h2>
      <div id="q2">
        <p>영수는 24살입니다.</p>
        <p>세종은 30살입니다.</p>
        <p>수영은 20살입니다.</p>
      </div>
    </div>
    <script>
      function checkResult() {
        let fruits = ["사과", "배", "감", "귤", "수박"];
        $("#q1").empty();
        fruits.forEach((element) => {
          let temp_html = `<p>${element}<p>`;
          $("#q1").append(temp_html);
        });


        let people = [
          { name: "서영", age: 24 },
          { name: "현아", age: 30 },
          { name: "영환", age: 12 },
          { name: "서연", age: 15 },
          { name: "지용", age: 18 },
          { name: "예지", age: 36 },
        ];


        $("#q2").empty();
        people.forEach((element) => {
          let temp_html = `<p>${element}<p>`;
          $("#q2").append(temp_html);
        });
      }
    </script>
  </body>
</html>

댓글 알림