반응형

Selector 4

jQuery Selector :animated

:animated selector는 애니메이션이 동작 중인 요소들을 찾습니다. 예제) Run 실행 모습)설명)우선 :animated는 jQuery에서 애니메이션 진행 상태에가 있는 요소를 찾습니다. $( "#run" ).click(function() { $( "div:animated" ).toggleClass( "colored" );});run이라는 엘리먼트 요소 버튼을 클릭했을 경우document안에 div 요소 중 :animated 즉, 애니메이션 동작을 하고 있다면 colored 클래스를 토글 방식으로 적용했다 안했다를 반복해라라는 뜻이 되겠네요.div 박스의 기본 background color는 노란색인데 colored는 녹색이죠. colored 클래스를 적용 했을 때는 녹색, 뺐을 때는 노란색 ..

Programming 2018.03.11

jQuery 문자열 포함 찾기 셀렉터

[name*=”value”] jQuery의 selector기능 활용하여 속성 값에 문자열이 포함 되어 있는 경우를 찾는 경우는 [name*=”value”] 이와 같이 사용하면 됩니다. java나 javascript에서 사용하는 indexOf > -1 와 동일한 기능이라고 보시면 됩니다. 예제) 결과) 설명) $( "input[name*='man']" ).val( "has man in it!" ); input 태그들 중에 name 속성 이름에 "man"이라는 문자열이 포함되어 있는 경우 value 값에 "has man in it!"을 넣어라. name이 newmilk인 경우 man 문자열이 포함되어 있지 않아 적용이 안 된 것입니다. 심플하쥬~?

Programming 2018.03.07

jQuery 셀렉터 - All Selector (“*”)

All Selectorjquery selector 중에 ("*")는 document에서 모든 요소를 찾습니다.모든 요소에 무언가 일괄 적용하는 일을 극히 드물겠죠. 무튼 이것을 사용하는 경우 일괄 적용하므로 속도에 영향을 끼치니 주의해서 사용해야 합니다. 예제) DIV SPAN P Button 실제 적용 후) $( "*" ).css( "border", "3px solid red" ) 이 구문에서 모든 엘리먼트를 찾아 3px 두께의 빨간 선을 적용한 것인데빨간 선이 적용된 엘레먼트 수인 13을 body 앞에 태그로 추가하였습니다. 요소 부터 DIV SPAN P Button $( "#test" ) 구문으로 를 찾고 find()로 자손들에서 찾아라 뭐를? "*" 전체를 말이죠. 결과는? test 아이디를 가진..

Programming 2018.03.07

jQuery selector - 간단 설명 기본 모음

1. 요소 선택기 (태그 선택기) html 안에 있는 모든 P태그를 찾습니다. $("P") 2. ID 선택기 이와 같은 name이 같은 요소가 존재한다면 id attribute를 추가하여 유일한 ID값을 지정 후 아래와 같이 아이디 앞에 #을 추가하여 사용합니다. $("#abc1") 3. .class 선택기 CSS의 class값을 지정한 element만 찾고 싶다면 아래 같이 class명 앞에 .(마침표)를 추가하여 사용합니다.$(".text_box"); 4. 전체 선택기 html상에서 전체 요소를 찾기는 경우는 극히 드물다고 보는데 아무쪼록 전체 선택 기능도 있습니다.$("*") 테스트 해 보기 : https://www.w3schools.com/jquery/tryit.asp?filename=tryjqu..

Programming 2018.03.07
반응형