Steady and right

탐색 선택자 탐색 선택자를 사용하면 기본 선택자로 선택한 요소 중 원하는 요소를 한번 더 탐색하여 좀 더 세밀하게 선택할 수 있다 위치 탐색 선택자 기본 선택자로 요소(태그)를 선택했을 경우 배열에 담기게 된다, 이때 배열의 인덱스(index)를 사용하면 특정 요소를 더 세밀하게 선택할 수 있는데 위치 탐색 선택자는 바로 이 인덱스를 활용하여 특정 요소를 선택하게 된다 구분 종류 사용법 설명 위치 탐색 선택자 first 선택자 $("선택 요소:first") $("선택 요소").first() 선택된 요소 중 첫번째 요소를 선택 예시 $("#menu li:first") $("#menu li").first() last 선택자 $("선택 요소:last") $("선택 요소").last() 선택된 요소 중 마지막 ..

인접 관계 선택자 인접 관계 선택자의 경우 직접 선택자로 요소(태그)를 먼저 선택하고 그다음 선택한 요소와 상관이 있는 (가까이에 있다던지 이전 혹은 그다음에 위치하고 있는) 요소를 선택할 때 사용한다. 구분 종류 사용법 설명 인접 관계 선택자 부모 요소 선택자 $("선택 요소").parent() 선택한 요소를 감싸고 있는 부모 요소를 선택 예시 $("#menu").parent(); 상위 요소 선택자 1. $("선택 요소").parents() 2. $("선택 요소").parents("선택 요소") 1. 선택한 요소 기준으로 모든 상위 요소 선택 2. 선택한 요소 기준으로 상위 요소 중 선택한 요소만 선택 예시 1. $(".example1").parents() 2. $(".example2").parents..

선택자 선택자는 HTML 요소를 선택해서 가져오는 역할을 한다. jQuery(제이쿼리)는 이 선택자를 통하여 HTML의 요소를 보다 쉽게 선택하여 동적인 CSS, 이벤트, 애니메이션 등을 적용할 수 있다. 매우 많은 선택자가 존재하며 본글에서는 기본선택자 중에 직접 선택자에 대하여 알아보고자 한다. 직접 선택자 구분 종류 사용법 설명 직접 선택자 전체 선택자 $("*") 모든 요소를 선택 예시 $("*").css("border", "1px solid black"); 아이디 선택자 $("#아이디명") id 태그에 지정한 값을 선택 예시 $("#menu").css("border", "1px solid black"); 클래스 선택자 $(".클래스명") class 태그에 지정한 값을 선택 예시 $(".categ..

제이쿼리(jQuery)의 탄생 이전에는 HTML의 Elements(요소)를 접근하는 것이 쉽지 않았다고 한다. 또한 웹브라우저마다 호환성이 떨어져 개발한 내용을 다른 브라우저에 적용하기가 어려웠다, 이에 제이쿼리가 요소의 접근을 물론 각 웹브라우저의 호환 더 나아가서는 애니메이션과 이벤트 등에도 편의 기능을 제공하며 자바스크립트에서 필수적인 존재로 자리 잡았다. (지금은 제이쿼리의 입지가 점점 더 좁아져 가는 상황이라고 한다.) 제이쿼리(jQuery)의 장점 제이쿼리가 왜 자바스크립트에서 많이 사용할 수 밖에 없었는지 장점을 통해 간단하게 알아보고자 한다. 1. HTML DOM의 접근성과 조작성 쉽게 말해 각 태그들에 접근하기가 용이하다, 제이쿼리의 선택자를 사용하면 클래스, 아이디 더 나아가서는 해당 ..