seungbostoryhappy

jQuery effects 메서드 show() 문서 객체를 크게 하며 보여줌. hide() 문서 객체를 작게 하며 사라지게 함. toggle() show() 메서드와 hide() 메서드를 번갈아 실행함. slideDown() 문서 객체를 슬라이드 효과와 함께 보여줌. slideUp() 문서 객체를 슬라이드 효과와 함께 사라지게 함. slideToggle() slideDown() 메서드와 slideUp() 메서드를 번갈아 실행함. fadeln() 문서 객체를 선명하게 하며 보여줌. fadeout() 문서 객체를 흐리게 하며 사라지게 함. fadeToggle() fadeln() 메서드와 fadeOut() 메서드를 번갈아 실행함. animate() 사용자 지정 효과를 생성함. ( opacity , height..

jQuery 메서드 (문서 객체 다루기) addClass() 문서 객체의 클래스 속성을 추가 함. => $('선택').addClass('정의한 클래스이름'); removeClass() 문서 객체의 클래스 속성을 제거 함. => $('선택'). removeClass ('삭제할 클래스이름'); arrt() 속성과 관련되 모든 기능을 수행함. 1. 이미지태그의 경로 속성값 알아내기 => $('img').attr('src'); 2. 속성 값추가 => $(selector).attr(속성이름 , 속성값); => $(selector).attr(속성이름 , function( 속성각각의 index값 ,attr ){} ); => $(selector).attr(object); => $('').attr('src', 'imag..

4. jQuery 어트리뷰트 기반으로 요소 선택 - $("img[alt]) // 이미지태그에 alt 속성이 있는것을 선택 - $("div[id~="name"]) // DIV태그에 아이디값이 "name"포함하는 모든것 [attr] 특정 어트리뷰트를 가지고 있는 요소와 일치 하는것 [attr=val] 지정되 어트리뷰트가 특정 값을 가지는 요소와 일치 [attr!=val] 지정된 어트리뷰트나 값을 갖지 않은 요소와 일치 [attr^=val] 지정된 어트리뷰트가 특정 값으로 시작하는 요소와 일지 [attr$=val] 지정된 어트리뷰트가 특정 값을 끝나는 요소와 일찌 [attr~=val] 공백과 함께 특정 값을 포함하는 요소와 일치 출처: https://turfrain.tistory.com/entry/1-jQue..

3. jQuery 함수 필터 선택자 [요소]:animated 애니메이션 중인것 / ":not(:animated)" => 애니메이션중이지 않은것 [요소]:contains(문자열) 특정 문자열을 포함하는 문서 객체를 선택함 [요소]:eq(n) n번째에 위치하는 문서 객체를 선택함 [요소]:gt(n) n번째 초과에 위치하는 문서 객체를 선택함 [요소]:lt(n) n번째 미만에 위치하는 문서 객체를 선택 [요소]:has(h1) h1 태그를 가지고 있는 문서 객체를 선택 [요소]:not(선택자) 선택자와 일찌하지 않는 문서 객체를 선택함 [요소]:nth-child(3n+1) 3n+1번째에 위치하는 문서 책체를 선택함 [요소]:hidden hidden 인것을 선택 [요소]:visible visible 인것을 선택 ..

2. jQuery 입력 양식 필터 선택자 [요소]:button input 태그중 type 속성이 button인 문서 객체와 button 태그를 선택함 [요소]:checkbox input 태그중 type 속성이 check인 문서 객체를 선택 [요소]:file input 태그중 type 속성이 file인 문서 객체를 선택 [요소]:image input 태그중 type 속성이 image인 문서 객체를 선택 [요소]:password input 태그중 type 속성이 password인 문서 객체를 선택 [요소]:radio input 태그중 type 속성이 radio인 문서 객체를 선택 [요소]:reset input 태그중 type 속성이 reset인 문서 객체를 선택 [요소]:submit input 태그중 typ..

1. jQuery 기본 필터 선택자 요소:odd 홀수 번째에 위치한 문서 객체르 선택함 요소:even 짝수 번째에 위치한 문서 객체를 선택함 요소:first 첫 번째 위치한 문서 객체를 선택함 요소:last 마지막에 위치한 문서 객체를 선택함 사용 예) 과일명 당도 사과 2 딸기 3 수박 4 멜론 2 $('tr:odd').css('background', '#F9F9F9'); $('tr:event').css('background', '#9F9F9F'); $('tr:first').css('background', '#333333').css('color','#FFFFFF'); // 배경색 / 글자색

jQuery 속성선택자 요소[속성] 특정 속성을 가지고 있는 문서 객체를 선택함 요소[속성=값] 속성 안의 값이 특정 값과 같은 문서 객체를 선택함 요소[속성~=값] 속성 안의 값이 특정 값을 단어로써 포함하는 문서 객체를 선택함 요소[속성^=값] 속성 안의 값이 특정 값으로 시작하는 문서 객체를 선택함 요소[속성$=값] 속성 안의 값이 특정 값으로 끝나는 문서 객체를 선택함 요소[속성*=값] 속성 안의 값이 특정 값을 포함하는 문서 객체를 선택함 사용 예) $('input[type=text]').val("텍스트 값추가");

제이쿼리의 사용률은 여전히 높으나. 개발자들 사이에서의 위상은 예전 같지가 않습니다. 앞서 언급한 구글 트렌드 추이뿐 아니라, 스테이트 오브 자바스크립트(https://2019.stateofjs.com/ko)가 공개한 유틸리티 라이브러리 선호도 조사 결과에서도 제이쿼리는 로다시(Lodash), 모멘트(Mome개발자들은 왜 제이쿼리에 흥미를 잃어가고 있을까요 제이쿼리의 위상이 추락한 원인은 다음과 같습니다. 웹 표준 API의 확장 W3C(World Wide Web Consortium)·WHATWG(Web Hypertext Application Technology Working Group)와 같은 단체의 노력으로 웹 표준은 끊임없이 발전해왔습니다. 그러나 그 노력의 이면에는 제이쿼리와 같은 라이브러리를 사용..