변경, 변환
기본
.text() : 해당 요소에 text 요소를 삽입 또는 변경
.html() : 해당 요소에 html 요소를 삽입 또는 변경
.val() : 해당 요소의 value 값을 삽입 또는 변경
.replaceAll()
해당 요소들로 인자 요소를 대체
$('<h2>New heading</h2>').replaceAll($("div"));
// div 요소를 <h2>New heading</h2> 요소로 변경한다.
.replaceWith()
해당 요소들을 인자의 요소로 바꾼다.
replaceAll() 과 선택, 인자(target)이 반대
$("div").replaceWith('<h2>New heading</h2>');
// <h2>New heading</h2> 요소로 div 요소를 변경 시킨다.배열
.toArray()
선택한 요소 DOM 집합을 자바스크립트 배열로 만든다.
var arr = $("div").toArray();
// arr[0] === <div>Hello</div>
$.makeArray
jQuery 집합의 요소 값을 JavaScript 배열로 변환한다.
var arr = $.makeArray($("input"));
// arr[0] === "Hello"
$.map()
선택된 배열 요소를 순서대로 callback 함수를 통해 얻어진 리턴값을 포함하는 새로운 jQuery 오브젝트 생성
var arr = $("div").map(function(){
return $(this).text().toUpperCase();
//선택된 요소들의 text값을 대문자로 변경한다.
});
var arr = $("div").map({width : 10, height: 15} ,function(value, index){
return index;
//key를 반환한다. ["width", "height"]
});
$.globalEval()
문자열로 명령어를 실행시켜준다.
$.globalEval("var newVar = true;")
// newVar == true
$.merge()
두개의 배열을 첫번째 배열에 합침
$.merge([0,1,2],[2,3,4]);
// 첫번째 배열 결과 : [0,1,2,2,3,4]
$.merge($.merge([],[0,1,2]),[2,3,4]);
// 첫번째 배열의 값을 유지하기 위해 새로운 배열을 만든다.
$.trim()
문자열 앞뒤에 있는 공백 문자를 제거하고 결과 반환
var trimStr = $.trim(str);
// str === " abc def ff "; trimStr === "abc def ff";
$.unique()
element 배열의 중복된 모든 element를 제거
- string, number 배열에서는 동작 X
var divs = $.unique(divs);
// divs의 중복 선택되어 들어간 element를 제거$.parseJSON()
JSON문자열을 JavaScript object로 반환
var obj = $.parseJSON('{"name":"John"}');
// 문자열 {"name":"John"}을 JavaScript object로 변환
alert(obj.name==="John");
// JavaScriptObject인 obj에서 name 요소인 John※ 참고 : 형식이 어긋난 JSON 문자열을 인자로 사용하면 exception이 발생한다.
문자열의 key 와 value 는 쌍따옴표("")를 사용해야 한다.
XML문서
$.parseXML()
유효한 XML문서를 파상한다.
$title = $.parseXML(xml).find("title");
// xml 파일에서 title의 값을 찾는다.
반응형