jQuery : 미리 작성된 javascript 함수
https://www.w3schools.com/jquery/jquery_get_started.asp
[jQuery 사용하기]
1. import
<head>태그 사이에 import 해준다.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
2. $로 시작, 괄호 안에 선택자로 대상을 적으면 됨. (중괄호 아닙니다. 그건 백틱 쓸ㄸ ㅐ!)
(선택자 . (class) or # (id))
$('#contents').hide();└ id가 contents 인 애들을 숨겨줘 ! (hide)
$('#post-box').show();└ id가 post-box인 애들을 나타내 줘 ! (show)
$('#post-url').val();└ id가 post-url인 값을 줘! (value)
$('#post-url').val('new text');└ id가 post-url인 값을 new text로 변경(입력)해줘! (value)
[html 없애기 / 추가하기]
$('#cards-box').empty();└ id가 card-box인 모든 html 을 삭제 (empty)
$('#cards-box').append(`<div class="card">
<img class="card-img-top"
src="이미지링크"
alt="Card image cap">
<div class="card-body">
<a href="#" class="card-title">제목</a>
<p class="card-text">내용 무궁화 삼천리 화려강산...</p>
<p class="card-text comment">코멘트</p>
</div>
</div>`);└ id가 card-box인 html 입력 (append)
'study > javascript' 카테고리의 다른 글
| 과일 개수 세기 (0) | 2021.06.05 |
|---|---|
| 문자열 / 백틱 (0) | 2021.06.05 |