【jQuery/Selector #44】Next Siblings Selector (“prev ~ siblings”) 1. Description 부모 Element 하위의 자식 Element중에서 prev다음에 오는 같은 태그들을 모두 찾는다. 2. Example ※ 예제에서는 prev == 이고, siblings == 이 된다. #1버튼을 클릭하면 태크 다음에 오는 모든 태그를 찾아서 배경색을 변경한다. 버튼을 클릭할 때마다 스타일이 토글된다. JavaScript/jQuery 2023.03.13
【jQuery/Selector #43】Next Adjacent Selector (“prev + next”) 1. Description 같은 (상위)부모 Element 하위의 자식 Element중에서 prev다음에 오는 next Element를 찾는다. 2. Example ※ 예제에서는 prev == , next == 이 된다. #1버튼을 클릭하면 [name='_1q74-example-1'] Selector 하위에서 태그 다음에 오는 태그를 찾아서 배경색을 변경한다. 버트을 클릭할 때마다 스타일이 토글된다. JavaScript/jQuery 2023.03.13
【jQuery/Selector #42】Multiple Selector (“selector1, selector2, selectorN”) 1. Description jQuery( "selector1, selector2, selectorN" ) : 입력한 모든 Selector의 Element들을 찾는다. 2. Example #1버튼을 클릭하면 border스타일이 변경된다. 버튼을 클릭할 때마다 스타일이 토글된다. JavaScript/jQuery 2023.03.06
【jQuery/Selector #41】Multiple Attribute Selector [name=”value”][name2=”value2″] 1. Description jQuery("[attributeFilter1][attributeFilter2][attributeFilterN]") : 입력한 속성들과 일치하는 Element들을 찾는다. 2. Example #1버튼을 클릭하면 name="first"이고 title속성이 설정된 Element를 찾아서 배경색을 변경한다. 버튼을 클릭할 때마다 스타일이 토글된다. JavaScript/jQuery 2023.03.06
【jQuery/Selector #40】:lt() Selector 1. Description 매칭된 Element들 중에서 index보다 작은 Element들을 찾는다. 처음부터 찾기 시작하는 index는 0부터 시작하고, 마지막부터 찾기 시작하는 index는 -1부터 시작한다. jQuery 3.4버전부터 Deprecated되었습니다. 대신 .slice()를 사용하세요. jQuery(":lt(index)") : 첫 번째 Element부터 찾기 시작하고, 첫 번째 index는 0이다. jQuery(":lt(-index)") : 마지막 Element부터 찾기 시작하고, 첫 번째 index는 -1이다. 2. Example JavaScript/jQuery 2023.03.06
【jQuery/Selector #39】:last Selector 1. Description jQuery(":last") : 매치된 Element들 중에서 가장 마지막 Element를 찾는다. jQuery 3.4버전부터 Deprecated되었습니다. 대신 .last()를 사용하시기 바랍니다. 2. Example #1버튼을 클릭하면 의 가장 마지막 Element를 찾아서 배경색을 변경한다. 버튼을 클릭할 때마다 스타일이 토글된다. JavaScript/jQuery 2023.03.06
【jQuery/Selector #38】:last-of-type Selector 1. Description jQuery(":last-of-type") : 각 부모Element 하위의 마지막 자식Element들중 태그이름이 같은 것을 찾는다. 2. Example #1버튼을 클릭하면 하위의 마지막 Element를 찾아 배경색을 변경한다. 버튼을 클릭할 때마다 스타일이 토글된다. JavaScript/jQuery 2023.03.05
【jQuery/Selector #37】:last-child Selector 1. Description jQuery(":last-child") : 각 부모Element에 대해 마지막 자식Element를 찾는다. 2. Example #1버튼을 클릭하면 각 의 가장 마지막 들을 찾아서 배경색을 변경한다. 버튼을 클릭할 때마다 스타일이 토글된다. JavaScript/jQuery 2023.03.05
【jQuery/Selector #36】:lang() Selector 1. Description jQuery(":lang(language)") : language코드가 설정된 Element를 찾는다. 1. language코드 + '-'(하이픈)이 따라오는 Element도 같이 찾는다. ex) :lang(en)은 :lang(en-us)도 포함하여 찾는다. 2. Example #1, #3버튼을 클릭하면 해당 laguage코드의 배경색을 변경한다. 버튼을 클릭할 때마 스타일이 토글된다. #2를 클릭하면 의 하위Element 배경색이 변경된다. :lang(language)앞에 태그(예지에서는 )가 생략되면 를 인식한다. JavaScript/jQuery 2023.03.05
【jQuery/Selector #35】:input Selector 1. Description jQuery(":input") : , , , 등의 Element를 찾는다. 2. Example #1버튼을 클릭하면 하위의 :input Element를 찾아서, 해당 Element가 들어있는 의 배경색을 변경한다. 버튼을 클릭할 때마다 무지개(?) 색상이 토글된다. JavaScript/jQuery 2023.03.05