jquery에서 선택한 요소를 가져오는 방법

웹 개발에서 매우 일반적으로 사용되는 JavaScript 라이브러리인 jQuery에는 웹 페이지의 요소를 쉽게 얻고 작동할 수 있는 강력하고 풍부한 API가 있습니다. jQuery는 HTML 문서에서 요소를 선택하기 위한 일련의 선택기를 제공합니다. 실제 개발에서는 사용자의 조작에 따라 선택된 요소를 얻어야 합니다. 이 글에서는 jQuery에서 선택된 요소를 얻는 방법을 소개하겠습니다.

1. 기본 선택기

기본 선택기는 jQuery의 가장 기본적인 선택기입니다. 기본 선택기를 통해 모든 DOM 요소, 요소 유형, 클래스, ID 등을 선택할 수 있습니다. 일반적으로 사용되는 기본 선택자는 다음과 같습니다.

1. *：选择所有元素
2. #id：根据id选择元素
3. .class：根据class选择元素
4. element：选择元素类型
5. [attribute]：选择有某个属性的元素
6. [attribute=value]：选择某个属性等于给定值的元素

2. 계층적 선택자

계층적 선택자는 지정된 요소 또는 요소 그룹 내에 중첩된 요소를 선택하는 데 사용할 수 있습니다. 다음은 일반적으로 사용되는 계층적 선택기입니다.

1. ancestor descendant：选择某元素内的后代元素
2. parent > child：选择某元素的直接子元素
3. prev + next：选择某元素之后的紧邻的兄弟元素
4. prev ~ siblings：选择某元素之后的所有兄弟元素

3. 필터 선택기

필터 선택기는 선택기에 특정 속성이 있는지 여부, 요소가 특정 상태(예: 표시 또는 차단됨)에 있는지 여부를 포함하여 상태에 따라 요소를 선택할 수 있습니다. ). 비활성화됨), 노드 위치 및 기타 조건. 다음은 일반적으로 사용되는 필터 선택기입니다.

1. :first、:last：选择第一个、最后一个元素
2. :not(selector)：选择不符合条件的元素
3. :even、:odd：选择偶数或奇数元素
4. :disabled、:enabled：选择被禁用、可用的元素
5. :checked：选择被选中的元素
6. :selected：选择被选择的元素

4. 선택한 요소 가져오기

jQuery에서 선택한 요소를 가져오는 두 가지 주요 방법이 있습니다.

1. 양식 요소의 val() 메서드를 사용하세요

선택한 요소가 입력, 텍스트 영역 등의 양식 요소인 경우 val() 메서드를 직접 사용하여 선택한 요소의 값을 가져올 수 있습니다.

var value = $("input:checkbox:checked").val();

위 코드 매개변수는 다음과 같습니다. input:checkbox:checked는 체크된 모든 요소가 선택된 다음 val() 메서드를 사용하여 해당 값을 가져오는 것을 의미합니다.

2. 선택기 및 이벤트 처리 기능 사용

우리가 선택한 요소가 양식 요소가 아닌 경우 선택기 및 이벤트 처리 기능을 통해 선택한 요소를 가져올 수 있습니다. 코드는 다음과 같습니다.

// 给被选中的元素绑定click事件
$("p").click(function() {
  $(this).toggleClass("selected");
});

// 获取被选中的元素
var selected = $("p.selected");

위 코드에서는 click() 메서드를 사용하여 선택한 요소에 클릭 이벤트를 바인딩하고 요소를 클릭하면 선택한 클래스 이름이 요소에 추가되거나 제거됩니다. 요소를 클릭했는지 여부를 나타냅니다. 마지막으로 선택기를 사용하여 선택한 요소를 가져옵니다.

요약: jQuery에서 선택한 요소를 가져오려면 기본 선택기, 계층적 선택기, 필터 선택기를 사용하거나 양식 요소의 val() 메서드와 이벤트 처리 기능을 통해 선택한 요소를 가져올 수 있습니다. 이러한 방법을 익히면 웹 페이지의 요소를 더 쉽게 조작할 수 있습니다.

위 내용은 jquery에서 선택한 요소를 가져오는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!