Open-Closed Principle

확장된 엘리먼트 집합이 있으면 새로운 엘리먼트를 추가해 이것을 증가시킬 수도 이쏙, 일치하는 원본 엘리먼트의 부분 집합으로 축소시킬 수도 있다. jQuery는 확장 엘리먼트의 집합을 관리하는 일련의 메소드를 지원한다. 1) 확장 집합에 다른 엘리먼트 추가하기예를 들어 alt나 title 어트리뷰트를 가진 모든 엘리먼트를 일치시키려고 한다. jQuery에는 이 요구사항을 셀렉터 하나로 표현할 수 있다. $(‘img[alt], img[title]’)하지만 add() 메소드를 사용하여도 똑같은 확장 엘리먼트를 만들 수 있다. $(‘img[alt]’).add(‘img[title]’)이와 같은 방식으로 add() 메소드를 사용하면 많은 셀렉터를 체인으로 연결해서 논리합(or) 관계를 형성하게 된다. 논리합 관계는..

보통은 확장된 엘리먼트의 집합을 얻어 jQuery커맨드를 사용해 일련의 작업을 수행할 수 있다. 예를 들자면 hide() 메서드로 모두 감출 수 있는 경우다. 그러나 확장된 엘리먼트를 참조하여 특정 엘리먼트에만 연산을 수행하고자 할 때도 있다. jQuery 확장 엘리먼트는 자바스크립트 배열과 유사하기 때문에 확장 리스트의 어떤 엘리먼트를 얻더라도 단순한 배열 인텍스를 사용 할 수 있다. $('selector').[index] 처럼 사용하면 된다. index는 0부터 시작한다. jQuery의 함수를 사용하고 싶으면 get(index)를 사용하면 된다. Colored By Color Scripter™12345678910get: function( num ) { return num != null ? // Ret..

jQuery 확장 엘리먼트 집합은 배열과 유사하다. 자바스크립트 배열처럼 length 프로퍼티를 지원하는데 확장 엘리먼트 또한 개수 정보를 갖고 있다. 확장 엘리먼트는 메소드가 지원되는데 $('selector').size()를 사용하여 확장 엘리먼트의 개수 정보를 확인 할 수 있다. http://code.jquery.com/jquery-1.11.1.js 에서 확인 할 수 있겠지만 실제 size()함수의 구현은 아래와 같다. Colored By Color Scripter™123jQuery.fn.size = function() {return this.length;}; 결국 .length와 .size()는 동일하다는 것이다.

jQuery를 이용해 엘리먼트를 선택하려면 셀렉터를 $()로 감싸야 한다.예) $('a') 모든 링크()를 선택하게 된다. 기본 CSS 셀렉터=> jQuery는 몇몇 예외사항을 제외하고는 CSS3를 완벽하게 준수하고 있다. 그리고 모질라 파이어폭스(Firefox), 인터넷 익스플로러(Internet Explorer), 사파리(Safari)와 같은 최신 브라우저가 지원하는 차세대 CSS를 사용해 고급 셀렉터를 지원한다. 즉, 표준 호환 브라우저의 스타일시트와 jQuery 셀렉터 엔진이 선택하는 엘리먼트는 동일하다.기본 사용1. a - 모든 링크() 엘리먼트와 일치하는 셀렉터.2. #specialID - specialID를 아이디로 가지는 엘리먼트와 일치하는 셀렉터3. .specialClass - speci..