JQuery 연습하기
<script>
$("#아이디명").empty();
$("#아이디명").append();
</script>위는 해당 아이디를 가진 태그를 삭제하는 함수
아래는 해당 아이디를 가진 태그를 생성하는 함수
만약 특정 버튼 클릭에 대한 이벤트로 특정 배열이나 객체를 읽어서 배열 각각의 요소를 태그로 생성시키고 싶다면
<script>
function checkResult() {
let people = [
{ name: "서영", age: 24 },
{ name: "현아", age: 30 },
{ name: "영환", age: 12 },
{ name: "서연", age: 15 },
{ name: "지용", age: 18 },
{ name: "예지", age: 36 },
];
$("#q2").empty;
people.forEach((a) => {
let temp_html = `<p>${a["name"]}는 ${a["age"]}살입니다.</p>`})
$("q2").append(temp_html);
}
</script>
<body>
<button onclick="checkResult()">결과 확인하기!</button>
</body>이렇게 코딩하면 버튼을 누름과 함께 "q2"라는 아이디명을 가진 태그를 우선 지우고, "people" 배열에 들어있는 객체 데이터들을 읽어서 태그에 대입하고 그 태그들을 생성하게 된다.
fetch의 기본골격
<script>
fetch("여기에 URL을 입력").then(res => res.json()).then(data => {
})
</script>이렇게 실행시키면 fetch함수 내에서 data라는 변수에 외부 URL로 읽어들인 데이터를 전부 할당시킨다는 의미가 된다.
