본문 바로가기

jQuery

231205 (jQuery) Jquery의 선택자 아이디 : $(’#아이디) 클래스 : $(’.클래스) 요소 : $(요소) 그룹 : $(선택자1, 선택자2 ….) 종속 : $(p선택자 값) jquery 선택자의 장점 선택자 기준으로 상대적 위치에 따른 접근이 가능하다. $(선택자).parents() : 부모요소 가져오기 $(선택자).children() : 모든 자식 요소 가져온다. $(선택자).siblings() : 형제요소 가져오기 jquery에서 클래스 변경 $('#name').toggleClass('available') addClass와 removeClass도 가능하다. contains는 hasClass로 가능하다. 예제 입력창을 2개 만들고 버튼 클릭 시 입력창의 내용물을 체크하여 4글자 이상인 경우 파란 배경, 4글자 미만.. 더보기
231019 (jQuery) 예시 14. 표의 추가 table은 리스트의 형태로 나타난다. append를 이용하여 html 코드를 작성하여 입력하면 table의 새로운 열을 만들 수 있다. 학번 이름 과목 학점 설명 학번: 이름: 과목: 학점: 설명: 입력 예시 15. remove, empty, children 메소드 remove() : 해당 요소를 전부 삭제 empty() : 해당 요소의 하위 요소를 삭제한다. children() : 앞의 요소의 자식 중 원하는 요소를 선택한다. “div:eq(0)” : div 태그 중 n번째 요소를 선택한다. 순서는 0부터 시작한다.(배열) Parent Element Child Element 1 Child Element 2 remove() empty() remove()-child2 예시 16. .. 더보기
231018 (jQuery) 예시 7. fade 메소드 fadeIn, fadeOut, fadeToggle(지속 시간, 사라지는 방법, 끝난 후 동작) 지속 시간은 밀리 초 단위, fast는 200, slow는 600, 기본 값은 400 사라지는 방법은 swing, linear가 있고 기본 값은 swing swing은 가속 감속이 있는 사라짐, linear는 정속 사라짐 끝난 후 동작은 함수가 들어간다. fadeTo(지속 시간, 투명도, 끝난 후 동작) 지속 시간과 끝난 후 동작은 fade 기능과 같고 투명도만 다르다 투명도는 0~1 사이의 값 Fade In Fade Out Fade Toggle 예시 8. slide 메소드 slideUp, slideDown, slideToggle(지속 시간, 사라지는 방법, 끝난 후 동작) 지속 시간.. 더보기
231017 (jQuery) jQuery 설치 1. jQuery 사이트에서 다운로드를 클릭한다. 2. 압축되지 않은 jQuery 슬림빌드의 링크를 저장한다. 3.html 파일에서 script 내부에 src로 저장한 링크를 넣는다. jQuery 자바스크립트 라이브러리 다양한 브라우저에 사용하는 API를 쉽게 사용할 수 있다. jQuery 기본 형태 $(셀렉터).이벤트(동작함수) 이벤트는 하나의 셀렉터에 나열하여 사용할 수 있다. $(document).ready(function () { }) 예시 1. #은 아이디, .은 클래스, 그냥은 태그 $().html = innerHTML과 같은 형태로 사용된다. $().css = style에 넣을 값을 지정할 수 있다. 클래스가 없다.클래스가 있다. 클래스가 없다.클래스가 있다. 태그만 있는 .. 더보기