선택자

html의 기본 선택자와 유사한데, jquery의 문법과 함께 사용해서 script를 적용할 대상을 지정한다.


기본형

$(html선택자).jquery선택자orMethod( script )

 ex)    $(#wrap).CSS.( 스타일 정의 ) 


jquery선택자

$( ).parent( script )    %()로 선택된 요소의 부모요소 선택

$( ).parents( script )   %()로 선택된 요소의 모든 상위 요소 선택

$( ).children( script )   %()로 선택된 요소의 모든 자식요소

$( ).prev( script )       %()로 선택된 요소의 이전요소

$( ).prevAll( script )    %()로 선택된 요소의 모든 이전요소

$( ).next( script )       %()로 선택된 요소의 다음요소

$( ).nextAll( script )    %()로 선택된 요소의 모든 다음요소

$( ).siblings( script )   %()로 선택된 요소의 모든 형제요소


$( ).first( script )        %()로 선택되는 요소중 첫번째 요소 선택

$( ).last( script )        %()로 선택되는 요소중 마지막 요소 선택

$( ).eq(index n).( script ) %()로 선택되는 요소중 index가 n번인 요소 선택

$(  : gt(index)).( script )  %()로 선택되는 요소중 index가 n번보다 큰 요소 선택

$(  : lt(index)).( script )   %()로 선택되는 요소중 index가 n번보다 작은 요소 선택

$(  ).slice(begin_index n1, end_index n2).( script ) 

  %()로 선택되는 요소중 index가 n1초과, n2포함되는 요소 선택


jquery Method

배열 Method

javascript Array에 있는 메서드들과 유사한 기능을 제공한다.


$( 선택자 ).each( callback )      arr의 각 요소로 callback 함수를 수행한다. (array의 .forEach() 와 같다 )

    =  $.each( arr선택자 , callbakc)

$.map( arr선택자, callback )     arr의 모든 요소로 callback 함수를 수행하고, callback 함수의 리턴값들을 모아 하나의 배열로 리턴한다.

$.grep( arr선택자, callback )     arr의 모든 요소로 callback 함수를 수행하고, 함수의 리턴이 true인 요소만 모아 배열로 만들어 리턴한다.                                         ( array.filter()와 같다. )

$.inArray( data, arr, begin_index n )  배열에서 n1자리부터 data를 찾아 첫번째 data의 자리를 number로 리턴 (array.indexOf() 와 같다.)

$.isArray( object )                  object가 배열이면 true, 아니면 false( Array.isArray(obj)와 같다)

$.merge( arr1, arr2)                두개의 배열을 이어붙여 하나의 배열로 리턴

$(선택자).index( 요소선택 )       배열에서




객체 조작

객체를 생성, 복제, 삭제, 변환 하는 문법


속성조작 Method

객체의 속성을 조작하는데, 이때 속성은 html의 구조나, html안에 내용, css 등 이 포함된다.


$( ).html( )             대상 안에 html 타입의 내용을 넣는다.    (입력내용이 태그로 인식)

$( ).text( )              대상안에 text 내용을 넣는다.

$( ).attr( )              HTML 대상에 속성을 넣거나 가져온다. ( ) 안에 "attr", "val" 을 넣으면 속성 저장 "val"을 생략하면 리턴

$( ).prop( )             Script 객체에 속성을 넣거나 속성의 값을 가져온다.

$( ).val( )               대상에 밸류값을 가져온다.(<tag value="val"> val을 가져옴)

$( ).css( )

$( ).addClass( )

$( ).removeClass( )

$( ).hasClass( )


attr() 은 html에 태그를 지정해 속성값을 가져오거나 설정하는데 사용해야 하고,

prop()는 script 상에서 DOM 객체의 속성값을 가져오거나 설정하는데 사용하도록 해야한다.

* prop()로 html상에 선언되어 있는(문서로 적혀있는 값)을 삭제하려고 하거나 변경하려고 하면 오류가 발생한다.

  attr()로 조작해야 한다.


수치조작 Method


객체 편집 Method






*체이닝 기법

jquery에서는 하나의 객체를 선택하고 해당 객체에 method를 연속해소 적용할 수 있다.

 ex)   $( 선택자 ).parent().css( style A).css( style B).  ...    

'Jquery' 카테고리의 다른 글

2.Manipulate  (0) 2019.12.12
3.Effect, Event  (0) 2019.12.12
5.플러그인  (0) 2019.12.10
0. Jquery란  (0) 2019.12.08
4. 비동기 연동(Ajax) 미완  (0) 2019.12.08

+ Recent posts