본문 바로가기
반응형

Library & Framework/jQuery13

[jQuery] 특정 HTML DOM 요소 제거하기 (ft. .remove()) - HTML DOM 요소 제거하기 - HTML에서 사용되는 특정 DOM 요소를 제거하는 방법에 대해 알아보자. jQeury에서 제공하는 .remove()를 사용할 것이다. 예제를 통해 가볍게 접해보자. ▷예제1) .remove() Test Type1 Test Type2 jQuery로 DOM 요소를 선택하고 .remove()를 사용만 해주면 끝이다. 생각보다 자주 쓰이게 되는 기능이라 알아두면 좋다. 2020. 8. 5.
[jQuery] 지정된 dom 요소 드래그 기능 부여하기 (ft. jQuery UI - .draggable()) - 지정된 dom 요소 드래그 기능 부여하기 - dom 요소를 제어할 때 드래그 기능을 사용해야 하는 경우가 생길수 있는데 최근에 자주 쓰게 되어서 정리해두고자 한다. jQuery UI 에서 제공하는 기능들이 생각보다 다양한데 이 드래그 기능 역시 jQuery UI에서 제공해주는 기능이다. 상세한 옵션은 많지만 아주 간단하게 드래그만 되도록 선언해 주는 방법에 대해 예제를 통해 접해보자. ▷예제1) ... 보면 알겠지만 dom 요소를 jQeury로 선택하고나서 .draggable()을 선언만 해주면 드래그가 가능하다. 상세 옵션은 아래에서 참조하여 개발하도록 하자. 참고 : https://superkts.com/jquery/draggable (jQuery 공작소) https://api.jqueryui.c.. 2020. 7. 10.
[jQuery] radio / checkbox script로 제어하기 (feat. prop, is, checked) - radio, checkbox script제어하기 - input type 의 radio 와 checkbox는 참 많이 쓰이는 것들인데 스크립트로 제어하다보니까 자꾸 까먹어 정리해두고자 한다. 코드를 중심으로 살펴보자. ▷ checkbox 제어 // 전체 체크 박스 가져오기 (by. name) $("input:checkbox[name=mineCheck]") // 전체 개수 (by. name) $("input:checkbox[name=mineCheck]").length; //선택된 개수 (by. name) $("input:checkbox[name=mineCheck] : checked").length; // 전체 체크 및 해제 (by. name) $("input:checkbox[name=mineCheck]".. 2020. 3. 29.
[jQuery] $(function(){}); 문법의 의미 (feat. document.ready, window.onload 차이점) - $(function(){}); 문법의 의미 - 그렇게 큰 의미를 가진 문법은 아니고 그저 $(document).ready(function(){...}) 와 같은 의미를 가진 문법이다. 그저 간편하게 줄인것이다. 여기서 더 나아가 (function(){...})() 가 존재하는데 이건 즉시실행함수라고 인터넷이 찾아보면 널려있다. (비슷한 역할이지만 제이쿼리 없이 사용가능한 스크립트 문법이다.) 그러면 다음으로 넘어가 $(document).ready() 와 window.onload = function(){} 이 둘의 차이점은 뭘까? $(document).ready()는 리소스 호출과 상관없이 DOM만 생성되어도 실행되는 문법이고 window.onload는 DOM뿐만 아니라 리소스 호출도 완료되었을 때 실.. 2020. 3. 8.
반응형
TOP

티스토리툴바