aboutsummaryrefslogtreecommitdiff
path: root/files/pt-br/web/api/parentnode/queryselector/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/pt-br/web/api/parentnode/queryselector/index.html')
-rw-r--r--files/pt-br/web/api/parentnode/queryselector/index.html101
1 files changed, 101 insertions, 0 deletions
diff --git a/files/pt-br/web/api/parentnode/queryselector/index.html b/files/pt-br/web/api/parentnode/queryselector/index.html
new file mode 100644
index 0000000000..0e719e1a73
--- /dev/null
+++ b/files/pt-br/web/api/parentnode/queryselector/index.html
@@ -0,0 +1,101 @@
+---
+title: ParentNode.querySelector()
+slug: Web/API/ParentNode/querySelector
+tags:
+ - PrecisaDeExemplo
+ - Projeto
+ - Referencia
+ - Seletores
+ - metodo
+translation_of: Web/API/ParentNode/querySelector
+---
+<p>{{APIRef("DOM")}}{{Draft}}</p>
+
+<p>O {{DOMxRef("ParentNode")}} mixin define o <code><strong>querySelector()</strong></code> método como retornar um {{DOMxRef("Element")}} representando o primeiro elemento que corresponde ao grupo especificado de seletores que são descendentes do objeto no qual o método foi chamado.</p>
+
+<p>Se você precisar de todos os elementos correspondentes à lista de seletores, use{{DOMxRef("ParentNode.querySelectorAll", "querySelectorAll()")}} instead.</p>
+
+<div class="blockIndicator note">
+<p>Nota: Este método é implementado como {{DOMxRef("Document.querySelector()")}}, {{DOMxRef("DocumentFragment.querySelector()")}} e {{DOMxRef("Element.querySelector()")}}.</p>
+</div>
+
+<h2 id="Sintaxe">Sintaxe</h2>
+
+<pre class="syntaxbox"><var>element</var> = <em>parentNode</em>.querySelector(<var>selectors</var>);
+</pre>
+
+<h3 id="Parâmetros">Parâmetros</h3>
+
+<dl>
+ <dt><code>selectors</code></dt>
+ <dd>Um {{DOMxRef("DOMString")}} contendo um ou mais seletores para comparar. Essa sequência deve ser um válido <a href="/en-US/docs/Web/CSS/CSS_Selectors">lista de seletores compostos</a> suportado pelo navegador; se não for, um <code>SyntaxError</code> exceção é lançada. Veja <a href="/en-US/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">Localizando elementos DOM usando seletores</a> para obter mais informações sobre o uso de seletores para identificar elementos. Vários seletores podem ser especificados, separando-os usando vírgulas.</dd>
+</dl>
+
+<div class="blockIndicator note">
+<p><strong>Nota:</strong> Os caracteres que não fazem parte da sintaxe CSS padrão devem ser escapados usando um caractere de barra invertida. Como o JavaScript também usa escape de backspace, deve-se tomar cuidado especial ao escrever literais de string usando esses caracteres. Veja {{anch("Escaping special characters")}} Para maiores informações.</p>
+</div>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>O primeiro {{DOMxRef("Element")}} que corresponda a pelo menos um dos seletores ou <code>null</code> se esse elemento não for encontrado.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota:</strong> Se o especificado <code>selectors</code> inclua um <a href="/en-US/docs/Web/CSS/Pseudo-elements">CSS pseudo-elemento</a>, o valor retornado é sempre <code>null</code>.</p>
+</div>
+
+<h3 id="Exceções">Exceções</h3>
+
+<dl>
+ <dt><code>SyntaxError</code></dt>
+ <dd>A sintaxe do especificado <code>selectors</code> string não é válida.</dd>
+</dl>
+
+<h2 id="Especificações">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-parentnode-queryselector", "ParentNode.querySelector()")}}</td>
+ <td>{{Spec2("DOM WHATWG")}}</td>
+ <td>Padrão de vida</td>
+ </tr>
+ <tr>
+ <td>{{SpecName("Selectors API Level 2", "#dom-parentnode-queryselector", "ParentNode.querySelector()")}}</td>
+ <td>{{Spec2("Selectors API Level 2")}}</td>
+ <td>Sem alteração</td>
+ </tr>
+ <tr>
+ <td>{{SpecName("DOM4", "#dom-parentnode-queryselector", "ParentNode.querySelector()")}}</td>
+ <td>{{Spec2("DOM4")}}</td>
+ <td>Definição inicial</td>
+ </tr>
+ <tr>
+ <td>{{SpecName("Selectors API Level 1", "#interface-definitions", "document.querySelector()")}}</td>
+ <td>{{Spec2("Selectors API Level 1")}}</td>
+ <td>Definição original</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidade_do_navegador">Compatibilidade do navegador</h2>
+
+<div class="hidden">A tabela de compatibilidade nesta página é gerada a partir de dados estruturados. Se você deseja contribuir com os dados, confira <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> e envie-nos uma solicitação de recebimento.</div>
+
+<p>{{Compat("api.ParentNode.querySelector")}}</p>
+
+<h2 id="Veja_também">Veja também</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">Localizando elementos DOM usando seletores</a></li>
+ <li><a href="/en-US/docs/Code_snippets/QuerySelector">Snippets de código para  <code>querySelector()</code></a></li>
+ <li><a href="/en-US/docs/Web/CSS/Attribute_selectors">Seletores de atributos</a> no guia CSS</li>
+ <li><a href="/en-US/docs/Learn/CSS/Introduction_to_CSS/Attribute_selectors">Seletores de atributos </a>na MDN Área de Aprendizagem</li>
+ <li>Seu método está disponível como {{DOMxRef("Element.querySelector()")}}, {{DOMxRef("Document.querySelector()")}}, and {{DOMxRef("DocumentFragment.querySelector()")}}</li>
+</ul>