blob: b6e75a7c9ff250c837b38e849dbb52d48e89f165 (
plain)
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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
|
---
title: Element.id
slug: Web/API/Element/id
tags:
- API
- DOM
- Gecko
- Property
- Reference
translation_of: Web/API/Element/id
---
<div>{{ApiRef("DOM")}}</div>
<div> </div>
<p>A propriedade <strong><code>Element.id</code></strong> representa o identificador do elemento, refletindo no atributo global <strong><a href="/pt-BR/docs/Web/HTML/Global_attributes/id">id</a></strong>.</p>
<p>O ID precisa ser único no documento, e geralmente é utilizado para obter o elemento usando {{domxref("document.getElementById", "getElementById")}}.. Outro uso comum de <code>id</code> é utilizar o <a href="/en-US/docs/Web/CSS/ID_selectors" title="Web/CSS/ID_selectors">ID como um seletor</a> ao estilizar o documento com CSS.</p>
<div class="note">
<p><strong>Nota</strong>: IDs são case-sensitive, mas você não deve criar IDs cuja única diferença nos nomes sejam letras maiúsculas/minúsculas (veja <a href="/en-US/docs/Case_Sensitivity_in_class_and_id_Names" title="Case_Sensitivity_in_class_and_id_Names">Case sensitivity in class and id names</a>).</p>
</div>
<h2 id="Syntax" name="Syntax">Sintaxe</h2>
<pre class="syntaxbox"><em>var idStr</em> = <em>element</em>.id; // Retorna o id.
<em>element</em>.id = <em>idStr; // Insere o id</em>
</pre>
<ul>
<li><code>idStr</code> é o identificador do elemento.</li>
</ul>
<h2 id="Specification" name="Specification">Especificações</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Especificação</th>
<th scope="col">Status</th>
<th scope="col">Comentário</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('DOM WHATWG', '#dom-element-id', 'id')}}</td>
<td>{{Spec2('DOM WHATWG')}}</td>
<td>Sem alteração desde {{SpecName('DOM2 HTML')}}.</td>
</tr>
<tr>
<td>{{SpecName('DOM2 HTML', 'html.html#ID-63534901', 'id')}}</td>
<td>{{Spec2('DOM2 HTML')}}</td>
<td>Sem alteração desde {{SpecName('DOM1')}}.</td>
</tr>
<tr>
<td>{{SpecName('DOM1', 'level-one-html.html#ID-63534901', 'id')}}</td>
<td>{{Spec2('DOM1')}}</td>
<td>Definição inicial.</td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility">Compatibilidade com navegadores</h2>
<p>{{ CompatibilityTable() }}</p>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari</th>
</tr>
<tr>
<td>Suporte básico</td>
<td>{{ CompatVersionUnknown() }}</td>
<td>{{ CompatVersionUnknown() }}</td>
<td>{{ CompatVersionUnknown() }}</td>
<td>{{ CompatVersionUnknown() }}</td>
<td>{{ CompatVersionUnknown() }}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Chrome para Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td>Suporte básico</td>
<td>{{ CompatVersionUnknown() }}</td>
<td>{{ CompatVersionUnknown() }}</td>
<td>{{ CompatVersionUnknown() }}</td>
<td>{{ CompatVersionUnknown() }}</td>
<td>{{ CompatVersionUnknown() }}</td>
<td>{{ CompatVersionUnknown() }}</td>
</tr>
</tbody>
</table>
</div>
<h2 id="Veja_também">Veja também</h2>
<ul>
<li>O atributo global <a href="/pt-BR/docs/Web/HTML/Global_attributes/id"><strong>id</strong></a>.</li>
</ul>
|
