반응형
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
//find : $(selector).find(filter)
// 일반 선택자로 선택 및 XML 문서에서 데이터 추출 시 사용
var xml = "";
xml += "<phones>";
xml += "<phone>";
xml += "<name>갤럭시노트10</name>";
xml += "<manufacturer>SAMSUNG</manufacturer>";
xml += "</phone>";
xml += "<phone>";
xml += "<name>G6</name>";
xml += "<manufacturer>LG</manufacturer>";
xml += "</phone>";
xml += "<phone>";
xml += "<name>아이폰 10</name>";
xml += "<manufacturer>APPLE</manufacturer>";
xml += "</phone>";
xml += "</phones>";
$(document).ready(function() {
xmlDOC = $.parseXML(xml);
console.log(xmlDOC);
$(xmlDOC)
.find("phone")
.each(function(index) {
var output = "";
output += "<div>";
output +=
"<h1>" +
$(this)
.find("name")
.text() +
"</h1>";
output +=
"<p>" +
$(this)
.find("manufacturer")
.text() +
"</p>";
output += "</div>";
document.body.innerHTML += output;
});
});
</script>
<title>Document</title>
</head>
<body></body>
</html>
반응형
'2020 > JQuery' 카테고리의 다른 글
| JQuery clone(), 문서 객체 복제 (0) | 2020.03.03 |
|---|---|
| JQuery removeAttr() , 문서객체 속성 제거 (0) | 2020.03.03 |
| JQuery is() (0) | 2020.03.02 |
| jquery 문서 객체 추가 선택(add) (0) | 2020.03.02 |
| JQuery 문서 객체 탐색 종료 (0) | 2020.03.02 |
꽃꽂이하는개발자