[JS] jQuery - 메소드

jQuery에는 다양하고 유용한 라이브러리가 굉장히 많다. 그렇기 때문에 많은 개발자들이 jQuery를 사용하는 것이다. 어떠한 메소드들이 있는지 살펴보자.

1. 배열관리 메소드
 $.each(objectArray, function(index, object){})
예)
$.each(array, function(index, obj){//첫 번째 인자로 배열의 인덱스가 오고 두 번째
var output = "";       //인자로 인덱스에 해당하는 객체가 넘겨진다.

output += "<a href=" + obj.link + ">";
output += "    <h1>" + index + " : " + obj.name + "</h1>";
output +="</a>"

document.body.innerHTML += output;
})

$(selector).each(function(index, object){})
예)
$(array).each(function(){//인자로 넘겨주는 값이 없을 때는 this로 객체에 접근 가능
var output = "";

output += "<a href=" + this.link + ">";
output += "    <h1>" + this.name + "</h1>";
output +="</a>"

document.body.innerHTML += output;
})

2. 객체 확장 메소드
$.extend(object, 속성 추가);
예)
var object = {};//빈 객체 생성

$.extend(object, {
    name: "용",
    gender: "남"
}


3. 필터링 메소드
$(selector).filter(selector);
filter의 인자의 선택자와 일치하는 배열 리턴(하나일 경우 하나의 객체만 리턴)


4. 특정 태그 선택 메소드
$(selector).find("tagName");
선택자 중에 tagName을 찾아 요소를 배열로 리턴(하나일 경우 하나의 객체만 리턴)

5. 속성 설정 및 속성 값 반환 메소드
$(selector).attr(name, value);
$(selector).attr(name, function(){});
$(selector).attr(objec);//object속성값 반환

그밖에 메소드들
css() : 스타일과 관련된 모든 기능을 수행(예: .css("font-size", "12 px"))
size() : 객체수를 반환
addClass() : 클래스 속성 추가
removeClass() : 클래스 속성 제거
attr() : 메서드의 인자를 통해 속성추가, 속성값 변경, 속성값 반환
removeAttr() : 속성을 제거
get() : jQuery객체를  DOM객체의 배열로 리턴(인자로 인덱스를 넣으면 배열에서 인덱스에 해당하는 DOM객체를 리턴)
not(expression) : 표현식에 일치하는 객체를 제거한 배열리턴
has(expression) : 표현식과 일치하는 자식을 가진 객체의 배열리턴
is(expression) : 표현식과 일치하는 객체의 배열리턴
end() : jQuery체인에 주로 이용되며 이전선택으로 돌아간다.
andSelf() : 체인에서 이전 두개의 선택자를 하나로 합친다.
html() : 객체 내부의 글자와 관련된 모든 기능 수행(html태그 인식)
text() : 객체 내부의 글자와 관련된 모든 기능 수행
find() : 특정 태크를 선택
remove() : 객체를 제거
empty() : 객체의 후손을 모두 제거
clone() : 객체를 복사
offset() : 객체의 위치를 조회하거나 지정
wrap() : 객체를 싸버린다. 선택한 객체를 자식으로 두고 싶을 때 사용.
$() : 객체 생성
$(A).appendTo(B) : A를 B의 뒷 부분에 추가(자식(A)을 부모(B)내용에 뒤에 붙인다)
$(A).append(B) : B를 A의 뒷 부분에 추가
$(A).prependTo(B) : A를 B의 앞 부분에 추가(자식(A)를 부모(B)내용에 앞에 붙인다)
$(A).prepend(B) : B를 A의 앞 부분에 추가
$(A).insertAfter(B) : A를 B의 뒤에 추가
$(A).After(B) : B를 A의 뒤에 추가(형제 B가 A의 뒤에 추가)
$(A).insertBefore(B) : A를 B의 앞에 추가
$(A).before(B) : B를 A의 앞에 추가(형제 B가 A의 앞에 추가)