IT/jquery 썸네일형 리스트형 jQuery를 이용한 HTML DOM 접근 방법 - 기본 셀렉터 오랜만에 jQeury관련 글을 올려봅니다. 한동아 블로그에 관심을 끄고 있다가 요 근래 들어 다시 블로그에 관심을 기울이고 있습니다. 앞으로는 꾸준히 블로그를 관리할 계획입니다. 오늘은 jQuery를 이용한 HTML DOM에 접근하는 방법에 대하여 정리해보겠습니다. jQuery의 강력한 기능인 HTML DOM을 탐색하는 기능에 대해 알아보겠습니다. jQuery의 DOM 탐색은 CSS Selecter를 사용하고 있어, CSS의 표현식을 알고 있다면 보다 쉽게 셀렉터를 이해 할 수 있습니다. jQuery에서는 원하는 HTML의 DOM 요소를 찾기 위해 $(Selector), jQuery(Selector)와 같은 표현식을 사용합니다. $는 jQuery의 축약어로 같은 역할을 하며, 다음과 같은 형태로 사용하여.. 더보기 jquery event - 이벤트를 동적으로 맴핑하기 오랜만에 글을 올립니다. 오늘은 jquery 이벤트 관련 메서드 중 동적으로 이벤트를 맵핑 할 수 있는 메서드를 정리해보겠습니다. 자바스크립트 등과 같은 웹용 개발언어에서 조금은 불편한 것이 동적인 부분의 처리가 어렵다는 것이었습니다. 그러니 jquery의 live 메서드와 die 메서드는 그런 부족한 부분을 채워주는 메서드 입니다. .live .live()의 메서드는 jqeury 플러그인으로 개발되어 사용이 되어오다가 jquery 버전 1.3 부터 정식 메서드로 추가되었습니다. 메서드 단어의 뜻으로는 정확히 어떤 기능을 하는 메서드인지 감이 잡히지 않습니다. 간단하게 설명하자면 개체(요소)에 이벤트라는 생명을 불어 넣어준다고 생각하시면 됩니다. 이해가 잘 안되시죠?(저도 잘 안됩니다. 메서드 이름의 단.. 더보기 jquery 이벤트 메서드 중요메서드 정리 jquery 이벤트 메서드들 중에서 가장 중요한 메서드인 bind() 메서드를 정리해보았습니다. .bind() 이 메서드는 단어로 이해를 하면 묶어준다는 뜻입니다. 개체와 이벤트를 묶어주는(연결해주는) 역할을 합니다. 다른 event 관련 메서드는 직접 호출하지만, bind()의 경우 파라미터의 값으로 이벤트 이름을 대입하여 해당 이벤트를 체크합니다. $("span").click(function() { alert('click'); }); event 메서드는 이렇게 사용했다면, bind() 메서드를 통해서는 다음과 같이 표현됩니다. $("span").bind('click', function() { alert('bind click');}); 두 메서드의 차이점은 .click() 메서드는 직접 호출을 하는 것.. 더보기 jquery 이벤트 지원 메서드 정리 jquery 이벤트에 정리를 해보도록 하겠습니다. jquery는 이벤트를 쉽고 간단하게 핸들링할 수 있는 여러 메서드를 제공하고 있습니다. jquery를 사용하지않는다면 직접 이벤트 지원 메서드를 사용자가 작성해야 하지만 jquery를 사용한다면 그런 수고를 덜 수 있습니다. 지원되는 메서드는 마우스 클릭 부터 더블클릭 그리고 마우스 휠에 대한 이벤트까지 쉽게 처리하고 사용할 수 있습니다. jquery에서 제공하는 이벤트 관련 메서드는 수 없이 많습니다. jquery를 사용하는 개발자는 많은 jquery를 이벤트를 쉽게 이용할 수 있고, 다양한 UX를 만들 수 있다는 장점이 있습니다.(저 같이 게으른 게발자에게는 더 없이 좋은 일입니다.) 오늘은 jquery 이벤트 지원 메서드에 대해 정리를 해보았습니다.. 더보기 jQuery Form 관련 메서드 정리 jQuery form 관련 메서드를 정리해보겠습니다. 웹 프로그램에서 Form은 매우 중요한 요소입니다. 물론 웹프로그램을 만들 필요가 없다면 별로 중요하지 않을 수 있습니다. 사용자의 데이터를 서버로 전송하는 역할을 합니다. form하면 항상 등장하는 메서드가 submit()입니다. "submit"는 form에 있는 데이터를 사용자가 지정한 곳에 보내는 역할을 합니다. jQeury에서 지원하는 .submit() 도 동일한 역할을 합니다. .submit(handler(eventObject))를 살펴 보면, 뒤에 handler라는 것이 존재를 하고 있습니다. submit()를 클릭하게 되면 정의된 handler가 실행이 되어 실행되고 난 후 결과에 따라 서버로 데이터를 전송 할 것인지 말 것인지를 결정하게.. 더보기 jQuery element(요소)의 속성 관련 메서드 정리 요즘 하는 일이 바쁘다 보니 jQuery 정리하는 것이 뒷전으로 밀렸습니다. 잠시나마 시간을 내어 jQuery element 속성을 제어하는 메서드들에 대해 공부한 후 정리를 해놓으려고합니다. 이렇게 정리를 해두어야 필요할 때 바로 이용할 수 있습니다.(제가 정리를 잘 못합니다.) 먼저 HTML 문서의 속성을 제어하는 메서드입니다. HTML element에서 이름을 제외한 나머지 요소는 모두 속성이 될 수 있습니다. 이라는 HTML 태그가 있다면 src, alt는 모두 요소가 됩니다. 정의되지 않은 값을 사용자 임의로 넣어 사용 가능합니다. (주의 : 사용자 정의 속성은 특별한 오류를 나타내지는 않지만, 간혹 웹브라우저(익스플로러,크롬,사파리,오페라 등) 특성으로 오류가 발생하는 경우가 있습니다.) .a.. 더보기 jQuery CSS 제어 메서드 정리 jQuery에서는 굉장히 많은 메서드를 제공하고 있습니다. 그 많은 메서드를 다 외워서 사용하기에는 불가능할 것이라 생각됩니다. 저 역시도 이제 막 새롭게 시작하다보니 메서드를 거의 외우지 못하고 있습니다. 제가 다른 컴퓨터 언어(Delphi, C, C++, C# )등을 공부할떄 기본 문법만 익히고 나서 나머지 함수(function 등)은 함수 목록을 한번 훑어보고 이러한 기능을 하는 함수들이 있구나 하고 넘어가고 실제 개발할 때 그 함수 목록을 검색하면서 개발을 했고, 지금도 그렇게 개발을 하고 있습니다. 따라서 jQuery를 공부하는데 있어서도 마찬가지 방법으로 공부를 하면 될 것이라고 생각하고 있으며, 지금은 jQuery를 이용하여 복잡한 개발을 할 생각은 없고 단지 운영하고 있는 블로그에 간단하게.. 더보기 [jQuery]jQuery Core 란? 간단하게 jQuery에 대한 간단한 설명, jQuery의 기초적인 문법에 대해 요약을 했습니다. 그것만 가지고는 jQuery를 이용해서 개발을 하기는 어려울 것입니다. 저는 jQuery관련 전문적으로 개발을 하는 사람이 아닌 관계로 깊이 있게 들어가지는 못했습니다. 그냥 어느정도 공개된 jQuery 플러그인을 가져다가 블로그나 웹페이지에 붙여넣어 사용하는 정도의 수준입니다. 그렇지만 공개된 jQuery 플러그인을 사용한다고 하더라도 기본적인 jQuery에 대한 문법 등은 알고 있어야 블로그에 적용하는데 어려움이 없을거라 생각하여 정리한 내용입니다. jQuery Core? 이번에는 jQuery core에 대해 정리 해보고자 합니다. jQuery 함수들을 살펴보면 jQuery 대신 "$"를 사용하고 있는 것.. 더보기 이전 1 2 다음
