jquery 선택기 및 속성 설정 사용 요약 experience_jquery

저는 최근에 프로젝트에서 jquery를 사용한 적이 없는 초보자입니다. 그 과정에서 여러 번 우회해서 계속 찾아다녔습니다. 참조를 위해 일부 사용법이 요약되어 있습니다.

가장 기본적인 선택기 구문에는 id, class, label, attribute가 포함되며 이는 CSS 선택기와 일치합니다.

ID 선택기는 ID 앞에 #을 추가해야 합니다. 예를 들어 ID가 myDivID(

)인 div 요소를 선택하려면 다음과 같이 작성할 수 있습니다.

코드 복사 코드는 다음과 같습니다.

$("# myDivID");

D는 반복될 수 없으므로 ID 선택기가 jquery 개체를 선택합니다.

클래스 선택기는 클래스 앞에 점(.)을 추가해야 합니다. 예를 들어 myInputClass 클래스( ), 다음과 같이 작성할 수 있습니다.

코드 복사 코드는 다음과 같습니다.

$ (".myInputClass");

class는 반복될 수 있으므로 클래스 선택기는 한 가지 유형의 요소, 즉 여러 요소를 선택할 수 있으므로 jquery는 배열을 선택하고 각 요소를 선택할 수 있습니다. 아래 첨자를 참조하여: 예를 들어

코드 복사 코드는 다음과 같습니다.

for (var i = 0; i < $(".myInputClass").length; i ) {$(".myInputClass")[i];}

이 방법으로 각 항목을 반복할 수 있습니다. 요소.

태그 선택기는 태그 유형을 직접 작성할 수 있습니다. 예를 들어 단락 p 태그(

)를 선택하려면 다음과 같이 작성하면 됩니다.

코드 복사 코드는 다음과 같습니다.

$("p")

태그 선택기도 선택됩니다. 배열, 모든 p 태그 요소를 선택하고 위 방법을 사용하여 모든 요소를 ​​반복할 수도 있습니다.

속성 선택자 앞에는 대괄호([])가 와야 합니다. 예를 들어 name="xxName"인 요소를 선택하려면 다음과 같이 작성할 수 있습니다.

코드 복사 코드는 다음과 같습니다.

$("[xxName]")

이렇게 선택하면 이름이 반복될 수 있으므로 결과는 동일하게 배열이 됩니다.

ID 선택기는 요소를 정확하게 선택할 수 있지만 개발 중에는 요소 그룹을 더 선택해야 할 수도 있습니다. 원하는 요소를 어떻게 정확하게 선택할 수 있습니까? 실제로 여러 선택기가 혼합될 수 있습니다.

코드 복사 코드는 다음과 같습니다.

예를 들어 짝수 개의 텍스트 레이블, 즉 짝수라고 표시된 텍스트 상자를 선택하려고 합니다. 다음과 같이 선택할 수 있습니다.

먼저 이 div를 선택한 다음 p를 선택하고 type="text"인 텍스트 상자를 선택한 다음 마지막으로 짝수 위치를 선택합니다.

코드 복사 코드는 다음과 같습니다.

$("#attrValueTab p input[type='text']:even" );


조합 선택은 개발에 매우 ​​유용합니다. 다음 방법을 사용하여 선택된 버튼 또는 체크박스 요소를 선택할 수 있습니다.

코드 복사 코드는 다음과 같습니다.

$("input[name='avDefValue_input']:checked")