files/zh-cn/conflicting/web/api/element/localname/index.html


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

---
title: Node.localName
slug: conflicting/Web/API/Element/localName
translation_of: Web/API/Node/localName
original_slug: Web/API/Node/localName
---
<div>
 {{ApiRef}}</div>
<h2 id="Summary" name="Summary">Summary</h2>
<p>Returns the local part of the qualified name of this node.</p>
<h2 id="Syntax" name="Syntax">Syntax</h2>
<pre class="syntaxbox"><var>name</var> = <var>element</var>.localName
</pre>
<ul>
 <li><code>name</code> is the local name as a string (see {{Anch("Notes")}} below for details)</li>
</ul>
<h2 id="Example" name="Example">Example</h2>
<p>(Must be served with XML content type, such as <code>text/xml</code> or <code>application/xhtml+xml</code>.)</p>
<pre class="brush:xml">&lt;html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:svg="http://www.w3.org/2000/svg"&gt;
&lt;head&gt;
  &lt;script type="application/javascript"&gt;&lt;![CDATA[
  function test() {
    var text = document.getElementById('text');
    var circle = document.getElementById('circle');

    text.value = "&lt;svg:circle&gt; has:\n" +
                 "localName = '" + circle.localName + "'\n" +
                 "namespaceURI = '" + circle.namespaceURI + "'";
  }
  ]]&gt;&lt;/script&gt;
&lt;/head&gt;
&lt;body onload="test()"&gt;
  &lt;svg:svg version="1.1"
    width="100px" height="100px"
    viewBox="0 0 100 100"&gt;
    &lt;svg:circle cx="50" cy="50" r="30" style="fill:#aaa" id="circle"/&gt;
  &lt;/svg:svg&gt;
  &lt;textarea id="text" rows="4" cols="55"/&gt;
&lt;/body&gt;
&lt;/html&gt;
</pre>
<h2 id="Notes" name="Notes">Notes</h2>
<p>The local name of a node is that part of the node's qualified name that comes after the colon. Qualified names are typically used in XML as part of the namespace(s) of the particular XML documents. For example, in the qualified name <code>ecomm:partners</code>, <code>partners</code> is the local name and <code>ecomm</code> is the prefix:</p>
<pre class="brush:xml">&lt;ecomm:business id="soda_shop" type="brick_n_mortar" xmlns:ecomm="http://example.com/ecomm"&gt;
  &lt;ecomm:partners&gt;
    &lt;ecomm:partner id="1001"&gt;Tony's Syrup Warehouse
    &lt;/ecomm:partner&gt;
  &lt;/ecomm:partner&gt;
&lt;/ecomm:business&gt;
</pre>

<div class="note">
 <p><strong>Note:</strong> In {{Gecko("1.9.2")}} and earlier, the property returns the upper-cased version of the local name for HTML elements in HTML DOMs (as opposed to XHTML elements in XML DOMs). In later versions, in compliance with HTML5, the property returns in the case of the internal DOM storage, which is lower case for both HTML elements in HTML DOMs and XHTML elements in XML DOMs. The {{domxref("element.tagName","tagName")}} property continues to return in the upper case for HTML elements in HTML DOMs.</p>
</div>
<p>For nodes of any <a href="/zh-CN/docs/DOM/Node.nodeType" title="DOM/Node.nodeType">type</a> other than <code>ELEMENT_NODE</code> and <code>ATTRIBUTE_NODE</code> <code>localName</code> is always <code>null</code>.</p>
<h2 id="Specification" name="Specification">Specification</h2>
<ul>
 <li><a href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-NodeNSLocalN">DOM Level 2 Core: Node.localName</a></li>
 <li><a href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-NodeNSLocalN">DOM Level 3 Core: Node.localName</a></li>
</ul>
<h2 id="See_also" name="See_also">See also</h2>
<ul>
 <li>{{domxref("Node.namespaceURI")}}</li>
</ul>