1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
|
---
title: Using XPath
slug: Using_XPath
tags:
- AJAX
- Add-ons
- DOM
- Extensions
- Transforming_XML_with_XSLT
- XPath
translation_of: Web/XPath/Introduction_to_using_XPath_in_JavaScript
translation_of_original: Using_XPath
---
<p><a href="ko/XPath">XPath</a>은 XML 문서의 위치 정보를 위한 언어입니다.
</p><p>이 문서는 자바스크립트 코드와 XPath의 관계를 위한 Mozilla 인터페이스에 대해 설명합니다. 이러한 것들은 (이 부분에 대해 W3C 작업 그룹에서 작성한) <a class="external" href="http://www.w3.org/TR/DOM-Level-3-XPath/">DOM Level 3 XPath</a>에 설명되어 있습니다.
</p><p>이 문서는 XPath 자체를 설명하지 않습니다. 기술에 대해 익숙하지 않다면 <a class="external" href="http://www.w3schools.com/xpath/">W3Schools XPath tutorial</a>을 참고하십시오.
</p>
<h3 id="Wrapper_function">Wrapper function</h3>
<p>다음의 함수는 주어진 XML 노드의 XPath 표현을 평가하는데 사용할 수 있습니다. 첫 번째 전달인자는 DOM 노드 혹은 Document 객체이고, 두 번째 전달인자는 XPath 표현에 대한 문자열 정의입니다.
</p>
<pre>// Evaluate an XPath expression aExpression against a given DOM node
// or Document object (aNode), returning the results as an array
// thanks wanderingstan at morethanwarm dot mail dot com for the
// initial work.
function evaluateXPath(aNode, aExpr) {
var xpe = new XPathEvaluator();
var nsResolver = xpe.createNSResolver(aNode.ownerDocument == null ?
aNode.documentElement : aNode.ownerDocument.documentElement);
var result = xpe.evaluate(aExpr, aNode, nsResolver, 0, null);
var found = [];
var res;
while (res = result.iterateNext())
found.push(res);
return found;
}
</pre>
<p>이 함수는 <code>new XPathEvaluator()</code>와 같이 사용할 수 있습니다. 이것의 생성자는 Mozilla에 정의되어 있습니다. 다른 브라우저에서 사용될 웹페이지에서 이 스크립트가 사용된다면 다음과 같이 <code>new XPathEvaluator()</code>를 호출하면 됩니다:
</p>
<pre> // XPathEvaluator is implemented on objects that implement Document
var xpe = aNode.ownerDocument || aNode;
</pre>
<p>이 예에서 <a href="ko/DOM/document.createNSResolver">XPathNSResolver</a>를 생성하는 것은 다음과 같이 간략화할 수 있습니다:
</p>
<pre> var nsResolver = xpe.createNSResolver(xpe.documentElement);
</pre>
<p>그러나 <code>createNSResolver</code>는 XPath 표현에 대한 네임스페이스가 정해져 있고, 그러한 것들이 쿼리를 보낼 문서의 내용과 일치하여야 합니다. 그렇지 않다면 당신 자신만의 XPathNSResolver를 수행하는 부분을 만들어야 합니다.
</p><p>(<a href="ko/Parsing_and_serializing_XML">Parsing and serializing XML</a>에서 설명하는 것과 같은) DOM 트리안에 로컬이나 원격 XML 파일을 읽기 위해 <a href="ko/XMLHttpRequest">XMLHttpRequest</a>를 사용한다면, <code>evaluateXPath()</code>의 첫 번째 전달인자는 <code>req.responseXML</code>가 되어야 합니다.
</p>
<h3 id=".EC.82.AC.EC.9A.A9.EC.98.88">사용예</h3>
<p>다음과 같은 XML 문서가 있다고 가정합니다.(<a href="ko/How_to_Create_a_DOM_tree">How to Create a DOM tree</a>와 <a href="ko/Parsing_and_serializing_XML">Parsing and serializing XML</a>을 참조하십시오.):
</p>
<pre><?xml version="1.0"?>
<people>
<person first-name="eric" middle-initial="H" last-name="jung">
<address street="321 south st" city="denver" state="co" country="usa"/>
<address street="123 main st" city="arlington" state="ma" country="usa"/>
</person>
<person first-name="jed" last-name="brown">
<address street="321 north st" city="atlanta" state="ga" country="usa"/>
<address street="123 west st" city="seattle" state="wa" country="usa"/>
<address street="321 south avenue" city="denver" state="co" country="usa"/>
</person>
</people>
</pre>
<p>XPath 표현으로 문서에 "query"를 보낼 수 있습니다. 비록 DOM 트리를 탐색하는 것이 비슷한 결과를 가져오더라도 XPath를 사용하는 것이 더 빠르고 강력합니다. 만일 <code>id</code> attribute를 사용한다면 <code>document.getElementById()</code>를 사용해도 여전히 강력합니다. 하지만, XPath 만큼 강력하지 않습니다. 몇 가지 예제가 있습니다:
</p>
<pre>// display the last names of all people in the doc
var results = evaluateXPath(people, "//person/@last-name");
for (var i in results)
alert("Person #" + i + " has the last name " + results[i].value);
// get the 2nd person node
results = evaluateXPath(people, "/people/person[2]");
// get all the person nodes that have addresses in denver
results = evaluateXPath(people, "//person[address/@city='denver']");
// get all the addresses that have "south" in the street name
results = evaluateXPath(people, "//address[contains(@street, 'south')]");
alert(results.length);
</pre>
<h3 id=".EC.A0.95.EB.B3.B4">정보</h3>
<ul> <li><a href="/ko/XPath" title="ko/XPath">XPath</a></li> <li><a class="external" href="http://www.topxml.com/code/default.asp?p=3&id=v20021221025528">XPath Visualizer for Mozilla and Firefox</a></li> <li><a class="external" href="http://www.w3schools.com/xpath/">XPath tutorial</a></li> <li><a class="external" href="http://forums.mozillazine.org/viewtopic.php?t=229106">Forum discussion on this topic</a></li> <li><a class="external" href="http://zeus.jesus.cam.ac.uk/~jg307/mozilla/xpath-tutorial.html">Using the Mozilla JavaScript Interface to XPath</a> - 자바스크립트로 XPath를 사용하는 것에 대한 튜터리얼</li>
</ul>
<p>{{ languages( { "fr": "fr/Utilisation_de_XPath", "ja": "ja/Using_XPath", "ko": "ko/Using_XPath" } ) }}</p>
|
