======jQuery Selectors====== * description : jQuery Selectors * author : 오션 * email : shlim@repia.com * lastupdate : 2021-04-15 \\ %%jQuery%% 셀렉터(selectors)는 %%jQuery%% 라이브러이의 가장 중요한 부분들 중 하나입니다.\\ =====jQuery Selectors===== %%jQuery%% 셀렉터를 사용하면 %%HTML%% 요소를 선택하고 조작할 수 있습니다.\\ \\ %%jQuery%% 셀렉터는 이름, id, 클래스, 유형(types), 속성(attributes), 속성 값 등을 기반으로 %%HTML%% 요소를 "찾기(즉, 선택)"에 사용됩니다.\\ 기존의 %%CSS%% 셀렉터를 기반으로 하고, 추가로 사용자 지정 셀텍터가 있습니다.\\ \\ %%jQuery%%의 모든 셀렉터는 달러 기호와 괄호 **%%$()%%**로 시작합니다.\\ =====The element Selector===== %%jQuery%% 요소 셀렉터는 요소 이름을 기반으로 요소를 선택합니다.\\ \\ 다음과 같이 페이지에서 모든 ''%%

%%'' 요소를 선택할 수 있습니다.\\ $("p") ====예제==== 사용자가 버튼을 클릭하면, 모든 ''%%

%%'' 요소들이 숨겨집니다.\\ $(document).ready(function() { $("button").click(function() { $("p").hide(); }); }); =====The #id Selector===== %%jQuery%% ''%%#id%%'' 셀렉터는 %%HTML%% 태그의 id 속성을 사용하여 특정 요소를 찾습니다.\\ \\ id는 페이지 내에서 유일해야 해서, 단 하나의 유일한 요소를 찾으려면 %%#id%% 셀렉터를 사용해야 합니다.\\ \\ 특정 id를 가진 요소를 찾으려면, 해시 문자와 %%HTML%% 요소의 id를 차례로 작성하십시오.\\ $("#test") ====예제==== 사용자가 버튼을 클릴하면, id="test"를 가진 요소는 숨겨집니다. $(document).ready(function() { $("button").click(function() { $("#test").hide(); }); }); =====The .class Selector===== %%jQuery%% ''%%.class%%'' 셀렉터는 특정 클래스를 가진 요소를 찾습니다.\\ \\ 특정 클래스를 가진 요소를 찾으려면, 마침표 문자(period character)를 먼저 쓴 이후 클래스 이름을 작성하십시오.\\ \\ $(".test") ====예제==== 사용자가 버튼을 클릭하면 class = "test"를 가진 요소가 숨겨집니다.\\ $(document).ready(function() { $("button").click(function() { $(".test").hide(); }); }); =====More Examples of jQuery Selectors===== ^ Syntax ^ Description ^ ^ $("*") ^ 모든 요소들을 선택합니다. ^ | $(this) | 현재의 HTML 요소를 선택합니다. | ^ $("p.intro") ^ class="intro"를 가진 모든

요소들을 선택합니다. ^ | $("p:first") | 첫 번째

요소를 선택합니다. | ^ $("ul li:first") ^ 첫 번째