링크 : https://releases.jquery.com/
아래 링크에서 버전을 선택 후 head 내부에 삽입한다.
<script src="<https://code.jquery.com/jquery-3.7.1.min.js>" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
예시) input태그의 값 가져와서 alert 출력하기
<div class="wrap">
<input id="name" type="text" placeholder="이름을 입력해 주세요">
</div>
function addPerson() {
// 아이디가 name인 input태그의 값을 가져오자
let name = $("#name").val()
alert(name) // 출력
}
예시) 태그 내부 내용 숨기기
<ul id="names">
<li>홍길동</li>
</ul>
<script>
function addPerson() {
// 아이디가 name인 input태그의 값을 가져오자
let name = $("#name").hide()
</script>
예시) input의 값을 태그로 추가하기
<div>
<div class="wrap">
<input id="name" type="text" placeholder="이름을 입력해 주세요">
</div>
<button onclick="addPerson()">입력</button>
<div class="peopleInSeoul">입력한 이름</div>
<ul id="names">
<li>홍길동</li>
</ul>
</div>
Markup
<script>
function addPerson() {
let name = $("#name").val()
let temp_html = `<li>${name}</li>`;
$("#names").append(temp_html);
}
</script>