제이쿼리(jQuery)란?

jQuery 란?

웹 개발에서 사용되는 자바스크립트 라이브러리로, HTML 문서 조작과 이벤트 처리를 간단하게 수행

jquery-3.7.1.js

0.27MB

 

 

jQuery 활용 예시

<script src="${pageContext.request.contextPath}/resources/js/jquery-3.7.1.js"></script>
<script type="text/javascript">
    function useId(id) {
        // 사용할 아이디를 부모창의 아이디 입력 텍스트박스에 표시
        // 1) 기본 자바스크립트 객체 활용(opener 객체를 활용하여 부모창 지정 가능)
// 			opener.document.querySelector("#id").value = id;

        // 2) jQuery 활용
        // 2-1) 선택자 지정 시 선택자 뒤에 두번째 파라미터로 opener.document 전달
        $("#id", opener.document).val(id);
// 			2-2) $(opener.document).find() 메서드를 활용하여 선택자 탐색
        $(opener.document).find("#id").val(id);
        // ----------------------------------------------
        // 현재창(자식창) 닫기
        close(); // window 객체 생략
    }
</script>

 

jQuery 특징

- 웹에서 자주 사용하는 기능의 간편화 (문서 객체 모델(DOM) 조작, 이벤트 처리, 애니메이션, AJAX 등을 간편하게 수행할 수 있도록 도와줌)

- 복잡한 자바스크립트 코드를 간결하게 작성

- jQuery의 모든 구문은 jQuery로 시작, 구문을 단순화 하기 위해 jQuery 대신 $로 사용

 

 

jQuery 선택자 종류

- 기본 선택자

$("*") : 모든 요소를 선택

$(".class") : 지정한 클래스를 가지는 모든 요소를 선택

$("#id") : 지정한 ID 속성을 가지는 하나의 요소를 선택