목록WebFront_/jQuery (6)
YJ의 새벽
Effect 메소드 ( 시각적 효과 ) -- 요소에 애니메이션 효과를 만들기 위한 메소드 집합 - $("요소명").메소드명(); - $("요소명").메소드명([speed]); - $("요소명").메소드명([speed], [easing], [callback]); speed : 실행속도 (ms) / 숫자 or slow , fast . easing : 변경되는 지점별 속도 / linear , swing callback : 메소드 실행 후 실행할 함수 show () , hide () 메소드 -- 요소를 점점 커지게 하면서 화면에 나타나거나 요소를 점점 작게 하면서 화면에서숨기는 메소드 fadeIn() , fadeOut() -- fadeIn() : 점점 불투명해지면서 나타남 -- fadeOut() : 점점 투명해..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/WCOOJ/btr2hJvZI4v/ohCaU5RKTdheh5FkBfeuKk/img.png)
-- html() : 요소에 작성된 내용을 얻어옴 (태그포함) - html("내용") : 요소에 내용 출력 (태그인식 O) == innerHTML -- text() : 요소에 작성된 내용을 얻어옴 (태그 미포함) - text("내용") : 요소에 내용 출력 (태그인식 X ) == innerText -- val() : value 속성값을 얻어옴. - val("내용") : value 속성값을 지정 기존에 작성되어있는 요소 html() 메소드 $("#btn1").on("click",function(){ // 아이디가 area 인 요소의 내용을 모두 삭제 $("#area").html(""); //아이디가 area 인 요소에 내용 출력 (태그포함) $("#area").html("html() 메서드로 작성된 내용"..
리셋 HTML 삽입 미리보기할 수 없는 소스 영어로 색 넣어보세요.
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bPpHeO/btr1KPYhPqQ/rTwyl3buxmf4WjBgxu81L0/img.png)
순회(탐색) 메서드 -- Ancestors (조상) 메서드 : 선택된 요소의 상위 요소들을 선택할 수 있는 메서드 -- $('요소명').parent() : 선택된 요소의 바로 위 상위 요소 -- $('요소명').parents( [매개변수] ) : 선택된 요소의 모든 상위 요소 리턴 매개변수가 있으면 매개변수와 일치하는 부모만 리턴. -- $('요소명').parentsUntil( [매개변수] ) : 선택된 요소부터 매개변수 요소까지 범위의 요소 리턴. 순회(탐색) 메서드1 div(wrap) div (great-grand parent) ul (grand parent) li (direct parent) span div (grand parent) p (direct parent) span $(function(){..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/SNxck/btr1Qx95Y61/J0hTfdFri6V5wnUdO0gmgK/img.png)
태그 선택자 -- jQuery 선택자는 css선택자와 같다 !! 태그 선택자 테스트1 테스트2 테스트3 테스트4 테스트5 테스트6 $(document).ready(function(){ // jQuery 선택자는 css 선택자와 같다 !! $("h5").css("color","red"); $("p").css("color","blue"); $("h5, p").css("backgroundColor","yellow"); //document.getElementsByTagName("p").style.color="green"; 배열에 스타일적용 X const arr = document.getElementsByTagName("p"); for(let result of arr){ result.style.color="gre..
// jQuery 라이브러리가 추가되지않았을때 나오는 오류 Uncaught ReferenceError: $ is not defined jQuery 란? ** jQuery 를 나타내는 기호는 '$' 이다 !!! -- 기존에 복잡했던 클라이언트 , 즉 HTML스크립팅을 간소화하기위해 고안된 Javascript 라이브러리 -- jQuery 는 적은양의 코드로 빠르고 풍부한 기능을 제공함. ( 라이브러리 (library) ) : 프로그램 , 프로그래밍 언어에 없는 추가적인 기능 jQuery 라이브러리 연결 방법 -- jQuery 공식 홈페이지 : https://jquery.com/ -- jQuery CDN 코드 제공 페이지 : https://code.jquery.com/ 1. jQuery 라이브러리 다운로드하여..