JQuery 필터선택자 , basic, child, form, content 필터

JQuery 필터선택자 , basic, child, form, content 필터

< script type = "text/javascript" >

$( function () {

var x = $( ":first" ); //첫 번째 요소, html태그 반환

console .log(x);

var x = $( ":last" ); //마지막 태그 div반환

console .log(x);

console .log(x.text());

console .log( "------------------------------" )

//너무 헷갈려서 찍어보면서 해야될듯... 익숙해지기 전까지..

var x = $( "li:last" ) //list태그의 마지막 , b4태그

console .log(x);

var a = $( ":first-child" ); //html,head,ul,li...모든 첫번째 자식들은 다 반환

console .log(a);

var a = $( "ul:first-child" ); //body의 자식인 ul들 중에서 첫번째 자식인 A list를 포함하는 ul반환

console .log(a);

var a = $( "ul>:first-child" ); //ul> ul의 자식요소들, 그 중에서도 첫번째 자식인 A,b반환

console .log(a);

var a = $( "li:last-child" ); //자식인 li들 중에서 마지막 list인 A4,b4반환

console .log(a);

console .log( "------------------------------" )

//index는 0부터 시작함

var x = $( ":even" ); //짝수번째 모든 태그들

console .log(x);

var x = $( ":odd" ); //홀수번째 모든 태그들

console .log(x);

var x = $( "li:even" );

console .log( ">>>" ,x); //A, b, A3, b3

var x = $( "li:only-child" ); //유일하게 자식으로 li하나만 있는 태그가 없어서 암것두 안나옴

console .log(x);

var x = $( "h1:only-child" );

console .log(x); //eee

var x = $( "li:nth-child(even)" ); //인덱스가 1부터 시작함

console .log(x); //A2,A4,B2,B4가 나온다.

var x = $( "li:nth-child(3)" ); //부모를 기준으로 3번의 태그

console .log(x); //A3,b3

})

< / script >

< / head >

< body >

< div >

< h1 > eee < / h1 >

< / div >

< ul >

< li > A < / li >

< li > A2 < / li >

< li > A3 < / li >

< li > A4 < / li >

< / ul >

< ul >

< li > b < / li >

< li > b2 < / li >

< li > b3 < / li >

< li > b4 < / li >

< / ul >

< div >

< p > Hello < / p >

< p > hello-end < / p >

< / div >

< div > hello-endenenenenenenen < / div >

from http://cocoshin.tistory.com/48 by ccl(A) rewrite - 2021-12-24 04:28:14