>웹 프론트엔드 >JS 튜토리얼 >Jquery_jquery에서 객체를 얻는 여러 가지 방법 소개

Jquery_jquery에서 객체를 얻는 여러 가지 방법 소개

WBOY
WBOY원래의
2016-05-16 17:03:211152검색

1. JQuery의 핵심 메소드 중 일부
each(callback) '루프와 같습니다
$("Element").length '요소의 개수는
$("Element") 속성입니다. size (); '요소의 개수이기도 하지만 괄호를 사용하면 메소드입니다.
$("Element").get() '페이지의 요소 모음, 배열 형식으로 저장됨
$(" Element").get(index); '함수는 위와 동일하며, index는 배열의 첨자인 요소를 나타냅니다.
$("Element").get().reverse( ); '얻은 배열을 넣는다 Direction
$("Element1").index($("Element2")) '요소 1에 있는 요소 2의 인덱스 값은 입니다.

2. 기본 객체 획득(여기서 획득한 Jquery 객체는 Dom 객체가 아니지만 변환 가능하다는 점에 유의하세요.)
$("*") '는 모든 객체를 획득한다는 뜻이지만 저는 한번도 획득한 적이 없습니다.
$("#XXX") 'id=XXX인 요소 개체를 가져옵니다(id는 태그의 ID 또는 CSS 스타일 ID일 수 있음). 일반적으로 사용됩니다.

$("input [name='username']") 입력 태그에서 name='userName'인 요소 개체를 얻으려면 일반적으로 사용됩니다.

$(".abc") ' 이름이 다음과 같은 요소 개체를 얻으려면 스타일 클래스에서 .abc이며 일반적으로 사용됩니다.
$(" div") ' 태그 선택기는 일반적으로 사용되는 모든 div 요소를 선택합니다.
$("#a,.b,span") '요소를 가져오는 것을 나타냅니다. ID a, 클래스 스타일 b를 사용하는 요소 및 모든 스팬 요소
$("#a .b p") 'ID 번호가 a이고 b 스타일을 사용하는 모든 p 요소

3.
$("Element1 Element2 Element3 ... .") '이전 상위 항목 뒤에 하위 집합이 옵니다.
$("div > p") 'div 아래의 모든 p 요소 가져오기
$("div p") 'div 요소 뒤의 첫 번째 p 요소
$("div ~ p") 'div 뒤의 모든 p 요소

4. 단순 객체 획득
$("Element:first" ) 'HTML 페이지에 있는 특정 유형의 요소 첫 번째 요소
$("Element:last") 'HTML 페이지에 있는 특정 유형의 요소의 마지막 요소
$("Element:not(selector )") '주어진 선택 요소와 일치하는 모든 요소를 ​​제거합니다. 예: $("input:not(:checked)")는 선택되지 않은 모든 확인란을 선택하는 것을 의미합니다
$("Element:even") '짝수 행 가져오기
$("Element:odd" ) '홀수 행 가져오기
$("Element:eq(index)") '주어진 인덱스 값 가져오기
$("Element:gt(index)") ' 주어진 인덱스 값을 가진 요소를 가져온 후 모든 요소
$("Element:lt(index)") '지정된 인덱스 값을 가진 요소 이전의 모든 요소를 ​​가져옵니다

5. object visible
$( "Element:contains(text)") '요소에 텍스트 텍스트 내용이 포함되어 있는지 여부
$('Element:empty") '하위 요소나 텍스트가 포함되지 않은 요소 가져오기
$("Element:partnt") ' 하위 요소 또는 텍스트를 포함하는 요소를 가져옵니다.
$("Element:has(selector)") '다음과 같은 특정 요소가 포함되어 있는지 여부: $("p: has(span)")은 범위 요소를 포함하는 모든 p 요소를 의미합니다.
$("Element:hidden") '보이는 모든 요소 선택
$("Element:visible") '보이지 않는 모든 요소 선택

6. 기타 객체 획득 방법
$( "Element[id]") 'ID 속성을 가진 모든 요소
$("Element[attribute = youlika ]" 'youlika 속성을 가진 모든 요소 가져오기
$("Element[attribute != youlika ]" '속성이 youlika가 아닌 모든 요소를 ​​가져옵니다
$("Element[attribute ^= youlika ]" '속성이 youlika가 아닌 모든 요소를 ​​가져옵니다
$ ("Element[attribute $ = youlika ]" '속성이 youlika로 끝나지 않는 모든 요소를 ​​가져옵니다
$("Element[attribute *= youlika ]" '속성이 youlika로 시작하는 모든 요소를 ​​가져옵니다
$(" Element [selector1][selector2][....]") '$("input[id][name][value=youulika]")와 같은 속성 선택기를 준수한다는 것은 ID, 이름 및 값을 가져오는 것을 의미합니다. youlika 입력 요소의

7. 하위 요소 얻기
$("Element:nth-child(index)") '상위 요소 아래의 n번째 요소 선택
$("Element:nth-child(even)" ) '부모 아래의 짝수 선택
$("Element:nth-child(odd)") '부모 아래의 홀수 선택
$("Element:nth-child(3n 1)" ) 'Expression
$("Element:first-child") '상위 요소 아래의 첫 번째 하위 요소 선택
$("Element:last-child") '상위 요소 아래의 마지막 하위 요소 선택
$ ("Element:only-child") '는 상위 아래의 유일한 하위 요소와 일치합니다. 예를 들어, dt가 dl 목록에 유일한 요소인 경우 dt

가 선택됩니다. 8. 양식을 가져옵니다. object
$(:input)//드롭다운 목록, 텍스트 필드, 라디오 버튼, 확인란 등을 포함한 모든 입력 요소를 찾습니다.
$(:text)//모든 한 줄 텍스트 상자 일치
$(:password)//모든 비밀번호 상자 일치
$(:radio)//모든 라디오 버튼 일치
$( :checkbox)//모든 체크박스 일치
$(:submit)//모든 제출 버튼 일치
$(:image)//
$( :reset)와 같은 모든 이미지 필드 일치// 모든 재설정 버튼 일치
$(:button)//모든 버튼 일치
$(:file)//모든 파일 업로드 도메인 일치
$(:hidden)/ /모든 보이지 않는 요소 또는 유형과 일치하는 요소 Hidden
$(:enabled)//사용 가능한 모든 입력 요소와 일치합니다. 예를 들어 radio:enabled는 사용 가능한 모든 라디오 버튼과 일치한다는 의미입니다.
$(:disabled) // 사용할 수 없는 모든 입력 요소와 일치하며 효과는 반대입니다. 위
$(:checked) // 선택한 체크박스 요소 모두 일치
$(:selected) // 모든 드롭다운 목록 일치

9 요소 속성 설정 및 제거
$ ("Element").attr(name) '$("img").attr("src")
$("Element".attr(key,value)")와 같이 첫 번째로 일치하는 속성 값을 가져옵니다. '특정 요소에 대한 속성 설정
$("Element".attr({key:value,key1:value,....})) '한 요소에 대한 여러 속성을 한 번에 설정
$("Element ").attr(key,function) '일치하는 모든 요소에 대해 계산된 속성 값 설정
$("Element").removeAttr(name)//속성 제거

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.