We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

A interface Element é a classe base mais geral da qual todos os objetos em um Document herda. Ela somente tem métodos e propriedades comuns para todos os tipos de elementos. Mais classes específicas herdam de Element. Por exemplo, a interface HTMLElement é a interface base para elementos HTML, enquanto a interface SVGElement é a base para todos os elementos SVG. A maioria das funcionalidades é especificada mais abaixo da hierarquia de classes. 

Linguagens fora do domínio da plataforma da Web, como XUL através da interface XULElement, também implementa Element.

Propriedades

Herda propriedades de seus parentes Node, e seu próprio parente, EventTarget, e implementa aqueles de ParentNode, ChildNode, NonDocumentTypeChildNode, e Animatable.

Element.attributes  Somente leitura
Retorna um NamedNodeMap que lista todos os atributos associados ao elemento.
ParentNode.childElementCount
É um Number representando o número de nós filhos que são elementos.
ParentNode.children
É um HTMLCollection ao vivo contendo todos os elementos filhos do elemento, como uma coleção.
Element.classList Somente leitura
Retorna um DOMTokenList contendo a lista de atributos de classe.
Element.className
É um DOMString representando a classe do elemento.
Element.clientHeight Somente leitura
Retorna um Number representando a altura interna do elemento.
Element.clientLeft Somente leitura
Retorna um Number representando a largura da borda do elemento..
Element.clientTop Somente leitura
Retorna um Number representando a largura da borda do topo do elemento.
Element.clientWidth Somente leitura
Retorna um Number representando a largura interna do elemento.
ParentNode.firstElementChild

É um Element, o primeiro elemento filho direto de um elemento, ou null se o elemento não tem elementos filho.

Element.id
É um DOMString representando o id do elemento.
Element.innerHTML
É um DOMString representando a marcação do conteúdo do elemento.
ParentNode.lastElementChild
É um Element, o último elemento filho direto de um elemento, ou null se o elemento não tem elementos filho.
NonDocumentTypeChildNode.nextElementSibling
É um Element, o elemento seguido imediatamente do dito na árvore, ou null se não há nó irmão.
Element.outerHTML
É um DOMString representando a marcação do elemento incluindo seu conteúdo. Quando usado como um setter, substitui o elemento com nós analisados a partir de uma determinada string.
NonDocumentTypeChildNode.previousElementSibling
É um Element, o elemento precedido imediatamente do dito na árvore, ou nulo se não há elemento irmão.
Element.scrollHeight Somente leitura
Retorna um Number representando a altura da vista de rolagem de um elemento.
Element.scrollLeft
É um Number representando o deslocamento de rolagem esquerdo do elemento.
Element.scrollLeftMax Somente leitura
Retorna um Number representando o deslocamento de rolagem esquerdo máximo possível para o elemento.
Element.scrollTop
É um Number representando o deslocamento de rolagem superior de um elemento.
Element.scrollTopMax Somente leitura
Retorna um Number representando o deslocamento de rolagem máximo superior possível para o elemento.
Element.scrollWidth Somente leitura
Retorna um Number representando a largura de exibição de rolagem do elemento.
Element.shadowRoot Somente leitura
...
Element.tagName Somente leitura
Retorna um String com o nome da tag para o elemento em questão.
Element.undoManager Somente leitura
Retorna o UndoManager associado com o elemento.
Element.undoScope
É a Boolean indicando se o elemento é um anular hospedagem de escopo, ou não.

Manipuladores de Eventos

Element.ongotpointercapture
Element.onlostpointercapture
Element.onwheel
Retorna o código de manipulação de evento para o evento wheel.

Métodos

Herda métodos de seus parentes Node, e seu proprío parente, EventTarget, e implementa aqueles de  ParentNode, ChildNode, NonDocumentTypeChildNode, e Animatable.

EventTarget.addEventListener()
Registra um manipulador de evento para um tipo específico de evento no elemento.
Element.closest()
Retorna o Element, descendente deste elemento(ou este elemento em si), que é o ancestral mais próximo dos elementos selecionados pelos seletores dados no parâmetro.
Element.createShadowRoot()
EventTarget.dispatchEvent()
Despacha um evento para este nó no DOM e retorna um Boolean que indica que pelo menos um manipulador não o cancelou.
Element.find()
...
Element.findAll()
...
Animatable.getAnimationPlayers()
Element.getAttribute()
Recupera o valor do atributo nomeado do nó atual e o retorna como um Object.
Element.getAttributeNS()
Recupera o valor do atributo com o nome especificado e namespace, do nó atual e o retorna como um Object.
Element.getAttributeNode()
Recupera a representação do nó de um atributo nomeado do nó atual e o retorna como um Attr.
Element.getAttributeNodeNS()
Recupera a representação de nó do atributo com o nome especificado e namespace, do nó atual e o retorna como um Attr.
Element.getBoundingClientRect()
...
Element.getClientRects() TYPE of returnvalue????
Retorna uma coleção de retângulos que indicam os retângulos delimitadores para cada linha de texto em um cliente.
Element.getDestinationInsertionPoints()
Element.getElementsByClassName()
Retorna um HTMLCollection vivo que contêm todos os descendentes do elemento atual que possui a lista de classes dadas no parâmetro.
Element.getElementsByTagName()
Retorna um HTMLCollection vivo contendo todos os elementos descendentes, de uma etiqueta de nome particular, do elemento atual.
Element.getElementsByTagNameNS()
Retorna um HTMLCollection vivo contendo todos os elementos descendentes, de uma etiqueta de nome particular e namespace, do elemento atual.
Element.hasAttribute()
Retorna um Boolean indicando se o elemento tem o atributo especificado ou não.
Element.hasAttributeNS()
Retorna um Boolean indicando se o elemento tem um atributo especificado, no namespace especificado, ou não.
Element.insertAdjacentHTML
Analisa o texto como HTML ou XML e insere os nós resultantes na árvore em dada posição.
Element.matches()
Retorna um Boolean indicando se o elemento seria ou não selecionado pelo seletor de string specificada.
Element.querySelector()
Retorna Node...
Element.querySelectorAll
Retorna um NodeList...
Element.releasePointerCapture
ChildNode.remove()
Remove o elemento da lista de filhos de seu parente.
Element.removeAttribute()
Remove um atributo nomeado do nó atual.
Element.removeAttributeNS()
Remove o atributo com o nome especificado ou namespace, do nó atual.
Element.removeAttributeNode()
Remove a representação do nó do atributo nomeado do nó atual.
EventTarget.removeEventListener()
Remove um ouvinte de eventos do elemento.
Element.requestFullscreen()
Assíncronamente pede o navegador para fazer o elemento tela cheia.
Element.requestPointerLock()
Permite assíncronamente pedir pelo apontador para ser bloqueado em um dado elemento.
Element.scrollIntoView()
Rola a página até que o elemento apareça na visão.
Element.setAttribute()
Define o valor de um atributo nomeado do nó atual.
Element.setAttributeNS()
Define o valor do atributo com o nome especificado e namespace, do nó atual.
Element.setAttributeNode()
Define a representação do nó de um atributo nomeado do nó atual.
Element.setAttributeNodeNS()
Define a representação do nó do atributo com o nome especificado e namespace, do nó atual.
Element.setCapture()
Define a captura de evento do mouse, redirecionando todos os eventos de mouse para este elemento.
Element.setPointerCapture()

Especificações

Specification Status Comment
Web Animations Rascunho atual Adicionado o método getAnimationPlayers().
UndoManager and DOMTransaction
The definition of 'Element' in that specification.
Rascunho editorial Adicionadas as propriedades undoScopeundoManager.
Pointer Events
The definition of 'Element' in that specification.
Recomendação Adicionados os seguintes manipuladores de evento: ongotpointercaptureonlostpointercapture.
Adicionados os seguintes métodos: setPointerCapture()releasePointerCapture().
Selectors API Level 2
The definition of 'Element' in that specification.
Obsoleto Adicionados os seguintes métodos: matches() (implementado como mozMatchesSelector()), find(), findAll().
Selectors API Level 1
The definition of 'Element' in that specification.
Obsoleto Adicionados os seguintes métodos: querySelector()querySelectorAll().
Pointer Lock
The definition of 'Element' in that specification.
Candidata a Recomendação Adicionado o método requestPointerLock().
Fullscreen API
The definition of 'Element' in that specification.
Padrão em tempo real Adicionado o método requestFullscreen().
DOM Parsing and Serialization
The definition of 'Element' in that specification.
Rascunho atual Adicionadas as seguintes propriedades: innerHTML, e outerHTML.
Adicionado o seguinte método: insertAdjacentHTML().
CSS Object Model (CSSOM) View Module
The definition of 'Element' in that specification.
Rascunho atual Adicionadas as seguintes propriedades: scrollTop, scrollLeft, scrollWidth, scrollHeight, clientTop, clientLeft, clientWidth, e clientHeight.
Adicionados os seguintes métodos: getClientRects(), getBoundingClientRect(), e scrollIntoView().
Element Traversal Specification
The definition of 'Element' in that specification.
Obsoleto Adicionada herança da interface ElementTraversal.
DOM
The definition of 'Element' in that specification.
Padrão em tempo real Removidos os seguintes métodos: closest(), setIdAttribute(), setIdAttributeNS(), e setIdAttributeNode().
Removida a propriedade schemaTypeInfo.
Modificado o valor de retorno de getElementsByTag()getElementsByTagNS().
Movida hasAttributes() da interface Node para esta.
Document Object Model (DOM) Level 3 Core Specification
The definition of 'Element' in that specification.
Obsoleto Adicionados os seguintes métodos: setIdAttribute(), setIdAttributeNS(), e setIdAttributeNode(). Estes métodos nunca foram implementados e foram removidos em especificações posteriores.
Adicionada a propriedade schemaTypeInfo. Esta propriedade nunca foi implementada e foi removida em especificações posteriores.
Document Object Model (DOM) Level 2 Core Specification
The definition of 'Element' in that specification.
Obsoleto O método normalize() foi movido para Node.
Document Object Model (DOM) Level 1 Specification
The definition of 'Element' in that specification.
Obsoleto Definição inicial.

Compatibilidade de Navegador

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Suporte básico 1.0 1.0 (1.7 or earlier) (Yes) (Yes) 1.0
children (Yes) 3.0 (1.9) 7.0 com um bug significativo[1]
9.0 de acordo com as especificações
(Yes) Não suportado
childElementCount, nextElementSibling, previousElementSibling (Yes) 3.5 (1.9.1) 9.0 (Yes) (Yes)
firstElementChild, lastElementChild (Yes) 3.0 (1.9) 9.0 (Yes) (Yes)
classList (Yes) 3.6 (1.9.2)   (Yes) (Yes)
outerHTML (Yes) 11 (11) (Yes) (Yes) (Yes)
clientLeft, clientTop (Yes) 3.5 (1.9.1) (Yes) (Yes) (Yes)
getBoundingClientRect(), getClientRects() (Yes) 3.0 (1.9) (Yes) (Yes) (Yes)
querySelector(), querySelectorAll() 1.0 3.5 (1.9.1) 8.0 10.0 3.2 (525.3)
insertAdjacentHTML() 1.0 8 (8) 4.0 7.0 4.0 (527)
setCapture() Não suportado 4.0 (2) Não suportado Não suportado Não suportado
oncopy, oncut, onpaste Não suportado 3.0 (1.9) (Yes)   Não suportado
onwheel Não suportado 17 (17) Não suportado Não suportado Não suportado
ongotpointercapture, onlostpointercapture, setPointerCapture(), e releasePointerCapture() Não suportado Não suportado 10.0 MS Não suportado Não suportado
matches() (Yes) com o nome não padrão webkitMatchesSelector 3.6 (1.9.2) com o nome não padrão mozMatchesSelector
34 (34) com o nome padrão
9.0 com o nome não padrão msMatchesSelector 11.5 com o nome não padrão oMatchesSelector
15.0 com o nome não padrão webkitMatchesSelector
5.0 com o nome não padrão webkitMatchesSelector
find()findAll() Não suportado Não suportado Não suportado Não suportado Não suportado
requestPointerLock() 16.0  webkit, atrás de um about:flags
22.0 webkit (com casos especiais, levantados progressivamente, veja [2])
14 (14)moz Não suportado Não suportado Não suportado
requestFullscreen() 14.0 webkit 10 (10) moz 11.0 ms 12.10
15.0 webkit
5.1 webkit
undoManagerundoScope Não suportado (Yes) (atrás do pref dom.undo_manager.enabled) Não suportado Não suportado Não suportado
attributes ? 22 (22)
Antes era disponível via interface Node que qualquer element herda.
? ? ?
scrollTopMax()scrollLeftMax() Não suportado 16 (16) Não suportado Não suportado Não suportado
closest() ? 35 (35) ? ? ?
hasAttributes() (Yes) 1.0 (1.7 or earlier) (na interface Node)
35 (35) (nesta interface)
(Yes) (Yes) (Yes)
Característica Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Suporte básico 1.0 1.0 (1) (Yes) (Yes) 1.0
scrollTopMax() and scrollLeftMax() Não suportado 16.0 (16) Não suportado Não suportado Não suportado
closest() ? 35.0 (35) ? ? ?
hasAttributes() (Yes) 1.0 (1.0) (na interface Node)
35.0 (35) (nesta interface)
(Yes) (Yes) (Yes)

[1] Internet Explorer 7 e 8 incorretamente retorna os comentários como parte do filho de um Element. Isto está fixado no Internet Explorer 9 e posterior.

[2] Chrome 16 permitiu webkitRequestPointerLock() somente em tela cheia; Chrome 21 para website confiável(com permissão do usuário);  Chrome 22 permitiu por padrão para todos documentos de mesma origem; Chrome 23 permitiu em testes em ambientes locais <iframe> se o valor não padrão webkit-allow-pointer-lock é definido para o atributo sandbox.

Etiquetas do documento e colaboradores

Colaboradores desta página: coloringa, fime, teoli
Última atualização por: coloringa,