Peridott의 개발 블로그

* slideDown() slideUp() 선택된 요소가 점점 위로 말려올라가면서 사라지고 점점 내려오면서 보여지게 하는 메소드 SlideUp SlideDown Lorem ipsum, dolor sit amet consectetur adipisicing elit. In ipsum quod numquam, optio voluptate necessitatibus expedita magni dolorum quis inventore sed modi facilis, maxime nesciunt labore cumque provident commodi molestiae! --> 질문에 대한 답 보여주기 Q. 질문입니다. A. 질문..

* fadeIn() fadeOut(), fadeToggle() 선택된 요소가 점점 투명해지면서 사라지고 점점 선명해지면서 보여지게 하는 메소드 FadeOut FadeIn FadeToggle Lorem ipsum dolor sit amet consectetur adipisicing elit. Nesciunt culpa accusantium illo fugit dolores non, perspiciatis odit rerum veritatis nisi iste numquam quasi laborum earum temporibus nihil ratione voluptate minima? Lorem ipsum dolor sit a..

시각적인 효과(Effect 메서드) 페이지 내에 애니메이션 효과를 주기 위해 사용되는 메서드들 * show() hide(), toggle() 선택된 요소가 점점 커지면서 보여지고, 점점 작아지면서 사라지게 되는 메소드 숨기기 보여주기 토글 Lorem ipsum dolor sit amet consectetur adipisicing elit. Nesciunt culpa accusantium illo fugit dolores non, perspiciatis odit rerum veritatis nisi iste numquam quasi laborum earum temporibus nihil ratione voluptate minima? ..

이벤트 핸들러(이벤트 발생시 실행될 function) 연결 방법 방법1. 이벤트 메서드를 이용한 연결 $('선택자').이벤트메서드(function() { 해당요소에 해당 이벤트가 발생되면 실행할 내용; }) 클릭해보세요 방법2. on 메서드를 이용한 연결 $('선택자').on('이벤트명', function() { 해당요소에 이벤트가 발생되면 실행할 내용; }); 마우스 클릭 및 올려보세요 방법3. on 메서드를 이용한 하위요소에 이벤트 걸기 $('상위요소선택자').on('이벤트명', '하위요소선택자(이벤트를 걸고자..

게시판 리스트 글번호 제목 작성자 조회수 작성일 3 세번째 글 제목 user01 23 2023-03-31 2 두번째 글 제목 user02 15 2023-..

추가적인 메서드 * each메서드 배열의 모든 인덱스에 순차적으로 접근할 때 사용 객체가 가지고 있는 모든 속성에 순차적으로 접근하고자 할 때 for in문과 유사하게 수행되는 메서드 1) $.each(객체|배열, function([매개변수1, 매개변수2]) { 순차적으로 접근할 때마다 실행할 내용; }); 2) 객체 배열.each(function([매개변수1, 매개변수2]) { 순차적으로 접근할 때마다 실행할 내용; }) 만약 객체를 제시했다면 첫번째 매개변수에는 순차적으로 접근할 때 마다..

요소 생성 및 제거 * 동적으로 요소 생성 요소 생성 * 삽입 관련 메서드 part1 선택된 요소를 기준으로 새로운 요소들을 추가시켜주는 메서드 $(A).append(B) : A요소 내에 뒷부분에 B를 추가(자손/하위) $(A).prepend(B) : A요소 내에 앞부분에 B를 추가(자손/하위) $(A).after(B) : A요소 뒷부분에 B를 추가(동위) $(A).before(B) : A요소 앞부분에 B를 추가(동위) * 삽입 관련 메서드 part2 선택된 요소를 기준으로 새로운 요소들을 추가시켜주는 메서드 $(B).appendTo(A) : A요소 내에..

Content (innerHTML, innerText) 관련 메소드 * html(['문구']) 메소드 : innerHTML 속성과 관련된 메소드 선택된 요소의 content영역의 값을 리턴해주거나 또는 변경해주는 메서드 > $('선택자').html() : 선택된 요소의 content영역 값을 반환해줌(html태그 포함) > $('선택자').html('문구') : 선택된 요소의 content영역 값을 해당 문구로 변경해 줌(html태그가 존재하면 태그로써 해석함) 네이버로 * text(['문구']) 메소드 : innerText 속성과 관련된 메소드 선택된 요소의 ..

탐색(순회) 메서드 * 동위 메서드 : 같은 레벨에 있는 요소들을 선택할 수 있는 메서드 - $('선택자').siblings() 선택된 요소와 같은 레벨에 있는 모든 요소들 선택 - $('선택자').siblings('선택자') 선택된 요소와 같은 레벨에 있는 모든 요소들 중 제시한 값과 일치하는 요소들만 선택 - $('선택자').next|prev() 선택된 요소와 같은 레벨 요소들 중 바로 다음요소|이전요소 하나만 선택 - $('선택자').nextAll|prevAll() 선택된 요소와 같은 레벨 요소들 중 모든 다음요소|이전요소들 선택 - $('선택자').nextUntil() ..

탐색(순회) 메서드 * 자손 메서드 : 기준이 되는 요소의 하위요소들을 선택할 수 있는 메서드 - $('선택자').children() 선택된 요소의 자손(바로 하위)요소들 선택 - $('선택자').children('선택자') 선택된 요소의 모든 자손들 중 제시한 값과 일치하는 요소들만 선택 - $('선택자').find('선택자') 선택된 요소의 모든 후손(하위요소들 전체)들 중 제시한 값과 일치하는 요소들만 선택 div(증조할머니) ul(할머니) li(엄마) span(나) ..