천천히 알아가는 세상

안녕하세요. 이번에는 JavaScript의 DOMCountentLoaded 기능에 대하여 알아보겠습니다. 1. DOMCountentLoaded 이 코드를 사용하면 JQuery의 document.ready와 크게 다를 바 없는 성능을 구현할 수 있다. 하지만 ie8이하에서는 지원하지 않기 때문에 본인이 대처해야 하는 환경이 어디까지인지 체크를 해 볼 필요가 있지만, 요즘은 ie8이하의 점유율이 대폭 낮아진 상태라 문제없이 사용할 수 있지 않을까라고 생각한다. window.addEventListener('DOMContentLoaded', function() { }); 제이쿼리를 사용하시는 분이라면 굳이 안 써도 되지만, JavaScript로 구현이 필요한 경우에 사용하시면 됩니다. 감사합니다.

안녕하세요. JQuery에서 Enter 이벤트 작성하는 방법입니다. login_id 아이디를 가진 곳에서 Enter를 클릭하면 이벤트가 발생합니다. keyCode를 이제는 안 쓰는 것으로 알고는 있지만, 아직 사용하는 곳도 있기 때문에 2개다 작성하였습니다. $("#login_id").keydown(function (key) { if (key.key == "Enter" || key.keyCode == "13") { user_login(); } }); 감사합니다.

안녕하세요. 이번에는 JQuery 기능 중에서 JQuery UI에 대하여 간단하게 알아보겠습니다. JQuery UI는 JQuery를 기본으로 하면서, 뷰를 표현하는 다양한 컴포넌트, 위젯을 모아놓은 User Interface를 모아 놓은 것입니다. JQuery UI는 CDN 형식으로 사용할 수 없기에 다운로드를 받아서 사용해야 합니다. JQueryUI 공식 홈페이지 jQuery UI jQuery UI is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library. Whether you're building highly interactive web ..

안녕하세요. 이번에는 JQuery의 Class 관련 함수에 대해 알아보겠습니다. 1. addClass 클래스를 추가하는 함수입니다. div입니다. addClass addClass 버튼을 클릭하면 div 태그에 ‘test’ 이름의 class가 추가됩니다. test 클래스가 이미 있는 상태에서는 버튼을 다시 눌러도 추가 적용되지는 않습니다. 2. removeClass 클래스를 삭제하는 함수입니다 div입니다. addClass removeClass 이번에는 addClass로 추가되었던 test 클래스를 removeClass 버튼을 클릭하여 삭제하는 장면입니다 3. hasClass 해당 클래스가 있는지 검사하여 존재 여부에 따라 True, False 값을 반환합니다. div입니다. addClass removeC..

안녕하세요. 이번에는 JQuery의 선택자에 대하여 간단하게 알아보겠습니다. parent $( 선택자 ).parent().함수() • 바로 위에 존재하는 하나의 부모 요소 선택 parents $( 선택자 ).parents().함수() • 바로 위 부모뿐만 아니라 부모의 부모, 모든 조상을 선택 next $( 선택자 ).next().함수() • 선택된 요소 바로 다음에 위치한 형제 요소 선택 prev $( 선택자 ).prev().함수() • 선택된 요소 바로 이전에 위치한 형제 요소 선택 children $( 선택자 ).children().함수() • 선택된 요소의 자식 요소 모두 선택 li 태그의 부모에 append 함수로 li 태그를 추가하는 코드입니다. 그리고 콘솔 로그를 이용하여 각 요소 선택자에 ..