recursal/MDN huggingface dataset:
WAI-ARIA Roles
==============

Essa página lista referências às atribuções WAI-ARIA discutidos no MDN. Para visualizar a lista completa, veja Using ARIA: Roles, States, and Properties

Utilizando a função "alerta"Esta técnica mostra como utilizar o atributo *role* alert e demonstra seu efeito em navegadores e tecnologias assistivas.
ARIA techniques
===============

O ARIA define as semânticas que podem ser aplicadas aos elementos, e são divididas em **funções** (definindo um tipo de elemento da interface do usuário) e **estados** e **propriedades** que são suportados por uma função. Os autores devem atribuir uma função ARIA e os estados e propriedades apropriados a um elemento durante seu ciclo de vida, a menos que o elemento já possua semântica ARIA apropriada (através do uso de um elemento HTML apropriado). A adição de semântica ARIA apenas expõe informações extras para a API de acessibilidade de um navegador e não afeta o DOM de uma página.

Funções
-------

### Funções de widget

* button (en-US)
* checkbox (en-US)
* gridcell (en-US)
* link
* menuitem
* menuitemcheckbox
* menuitemradio
* option
* progressbar
* radio
* scrollbar
* searchbox
* separator (when focusable)
* slider
* spinbutton
* switch (en-US)
* tab (en-US)
* tabpanel (en-US)
* textbox
* treeitem (en-US)
### Funções compostas

As técnicas abaixo descrevem cada função composta, bem como suas funções filho obrigatórias e opcionais.

* combobox
* grid (en-US) (incluindo as funções row (en-US), gridcell (en-US), rowheader, columnheader)
* listbox (incluindo a função option)
* menu
* menubar
* radiogroup (veja a função radio)
* tablist (en-US) (incluindo as funções tab (en-US) and tabpanel (en-US))
* tree (en-US)
* treegrid
### Funções da estrutura de documento

* application (en-US)
* article (en-US)
* cell (en-US)
* columnheader
* definition
* directory
* document (en-US)
* feed
* figure (en-US)
* group
* heading (en-US)
* img
* list (en-US)
* listitem (en-US)
* math
* none
* note
* presentation
* row (en-US)
* rowgroup (en-US)
* rowheader
* separator
* table (en-US)
* term
* textbox (en-US)
* toolbar
* tooltip (en-US)
### Funções de ponto de referência

* banner
* complementary (en-US)
* contentinfo (en-US)
* form (en-US)
* main (en-US)
* navigation (en-US)
* region (en-US)
* search (en-US)
### Funções de regiões ativa

* alert
* log
* marquee
* status
* timer (en-US)
### Funções de janela

* alertdialog (en-US)
* dialog (en-US)
Estados e propriedades
----------------------

### Atributos de widget

* aria-autocomplete
* aria-checked
* aria-current
* aria-disabled
* aria-errormessage
* aria-expanded
* aria-haspopup
* aria-hidden
* aria-invalid
* aria-label
* aria-level
* aria-modal
* aria-multiline
* aria-multiselectable
* aria-orientation
* aria-placeholder
* aria-pressed
* aria-readonly
* aria-required
* aria-selected
* aria-sort
* aria-valuemax
* aria-valuemin
* aria-valuenow
* aria-valuetext
### Atributos da região ativa

* aria-live
* aria-relevant
* aria-atomic
* aria-busy
### Atributos de drag & drop

* aria-dropeffect
* aria-dragged
### Atributos de relacionamento

* aria-activedescendant
* aria-colcount
* aria-colindex
* aria-colspan
* aria-controls
* aria-describedby
* aria-details (en-US)
* aria-errormessage
* aria-flowto
* aria-labelledby
* aria-owns
* aria-posinset
* aria-rowcount
* aria-rowindex
* aria-rowspan
* aria-setsize
### Propriedades específicas do MicrosoftEdge

* x-ms-aria-flowfrom (en-US) 
Non-standard
ARIA guides
===========

Aplicações de internet ricas acessíveis (**ARIA**) define caminhos para fazer a web mais acessível para pessoas com deficiências. Umas poucas linhas guias para seguirem que garante melhor acessibilidade, como usar drag and drop para colocações de widgets.

* Manipulação de erros em formulários
* Widgets de rotulagens
* Rotulagem de widgets compostos e regiões
* Gerenciamento do foco em Widgets Compostos (aria-activedescendant vs roving tabindex)
* Usando funções de referência
* Manipulação dinâmica de atualizações & Regiões ao vivo
* Virtual vs. Modo não Virtual em AT Produtos
* Usando Drag & Drop
* Notificar usuários de Não-ARIA Leitores de telas
* Estrtura de fixação com papel de apresentação
* Esconder tabela de leiaute (Layout)
* Gerenciamento de diálogos modais e não modais
* Usando ARIA com HTML5
* Como testar ARIA
* ARIA em dispositivos móveis
Geolocation
===========

A interface **Geolocation** representa um objeto ábil de programaticamente obter a posição do aparelho. Dá ao conteúdo web acesso à localização do aparelho. Isto permite com que o website ou a aplicação ofereça resultados customizados baseados na localização do usuário.

Um objeto com tal interface é obtido utilizando a propriedade `NavigatorGeolocation.geolocation` (en-US) implementada pelo objeto `Navigator` (en-US).

**Nota:** Por questões de segurança, quando uma página tenta obter acesso às informações de localização o usuário é notificado e uma requisição é feita para o mesmo fornecesser a permissão. Saiba que cada navegaor possui suas próprias políticas e métodos para requisitar tal permissão.

Propriedades
------------

*A interface* Geolocation *não implementa nem herda qualquer propriedade.*

Métodos
-------

*A interface* Geolocation *não herda qualquer métodos.*

`Geolocation.getCurrentPosition()`

Determina a posição atual do aparelho e retorna um objeto `Position` com os dados.

`Geolocation.watchPosition()`

Retorna um valor long representando a nova função de callback estabelecida para ser invocada a qualquer momento que o localização do aparelho alterar-se.

`Geolocation.clearWatch()`

Remove qualquer encarregado previamente instalado usando *watchPosition()*.

Especificações
--------------

| Specification |
| --- |
| Geolocation API # geolocation\_interface |

Compatibilidade com navegadores
-------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Veja Também
-----------

* Usando Geolocation (en-US)
DeviceAcceleration
==================

**Experimental:** **Esta é uma tecnologia experimental (en-US)**  
Verifique a tabela de compatibilidade entre Navegadores cuidadosamente antes de usar essa funcionalidade em produção.

Um objeto `DeviceAcceleration` fornece informações sobre a quantidade de aceleração que o dispositivo desempenha ao longo dos três eixos.

Propriedades
------------

`DeviceAcceleration.x` (en-US) Somente leitura 

A quantidade de aceleração ao longo do eixo X. **Somente leitura**.

`DeviceAcceleration.y` (en-US) Somente leitura 

A quantidade de aceleração ao longo do eixo Y. **Somente leitura**.

`DeviceAcceleration.z` (en-US) Somente leitura 

A quantidade de aceleração ao longo do eixo Z.**Somente leitura**.

Especificações
--------------

| Specification |
| --- |
| DeviceOrientation Event Specification # devicemotioneventacceleration |
Location
========

Resumo
------

A interface `Location` representa a localização do objeto a qual ele está associado. Mudanças feitas na interface serão refletidas nos objetos relacionados a ela. Tanto a interface `Document`, como a interface `Window` , têm este vínculo com a inteface Location, acessível via `Document.location` e `Window.location` respectivamente.

Propriedades
------------

*A inteface `Location` não herda nenhuma propriedade, mas implementa as propriedades de* *`URLUtils`.*

`URLUtils.href`

É uma `DOMString` que contém toda URL.

`URLUtils.protocol`

É uma `DOMString` que contém o esquema de protocolo da URL, incluindo o final ':'.

`URLUtils.host`

É uma `DOMString` que contém o *host*, que é o *hostname* seguido de ':' e a *port* da URL.

`URLUtils.hostname`

É uma `DOMString` que contém o domínio da URL.

`URLUtils.port`

É uma `DOMString` que contém o número da porta da URL.

`URLUtils.pathname`

É uma `DOMString` que contém `'/'`, como caractere inicial, seguido do caminho da URL.

`URLUtils.search`

É uma `DOMString` que contém um `'?'` seguido dos parâmetros da URL.

`URLUtils.hash`

É uma `DOMString` que contém um `'#'` seguido do identificador de fragmento da URL.

`URLUtils.username`

É uma `DOMString` que contém o nome de usuário especificado antes do nome de domínio.

`URLUtils.password`

É uma `DOMString` que contém a senha especificada antes do nome de domínio.

`URLUtils.origin` Somente leitura 

Retorna uma `DOMString` que contém a forma canônica da origem do local especificado.

Métodos
-------

*A inteface `Location` não herda nenhum método, mas implementa os métodos de `URLUtils`*

`Location.assign()`

Carrega o recurso na URL fornecida como parâmetro.

`Location.reload()`

Recarrega o recurso a partir da URL atual. Seu único parâmetro opcional é um `Boolean` (en-US), que, quando verdadeiro (`true)`, faz com que a página sempre seja recarregada a partir do servidor. Se for falso (`false)` ou não especificado, o navegador pode recarregar a página a partir de seu cache.

`Location.replace()` (en-US)

Substitui o recurso atual pelo recurso presente na URL fornecida. A diferença entre o método `assign()` é que após usar `replace()` a página atual não será salva na sessão `History` (en-US), ou seja, o usuário não será capaz de usar o botão *voltar* para navegar até a página.

`URLUtils.toString()`

Retorna uma `DOMString` que contém toda URL. O método é um sinônimo para `URLUtils.href`, embora não possa ser usado para modificar o valor.

Especificações
--------------

| Specification |
| --- |
| HTML Standard # the-location-interface |

Compatibilidade com navegadores
-------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Veja também
-----------

* Dois métodos que criam um objeto Location: `Window.location` e `Document.location`.
DocumentFragment
================

A interface do **DocumentFragment** representa um objeto de documento mínimo que não possui pai. Ela é utilizada como uma versão leve de `Document` para armazenar fragmentos bem formados ou fragments potencialmente mal formados de XML.

Vários outros métodos podem usar um document fragment como argumento (ex. qualquer interface de `Node` como `Node.appendChild` e `Node.insertBefore`) em casos em que os filhos do fragment são acrescentados ou inseridos, e não o próprio fragment.

Essa interface também é excelente para ser usada com Web components: elementos `<template>` contém um `DocumentFragment` na propriedade `HTMLTemplateElement.content` (en-US) deles.

Um DocumentFragment pode ser criado usando o método `document.createDocumentFragment` (en-US) ou o construtor.

Propriedades
------------

*Essa interface não tem uma propriedade específica, mas herda de seu pai,* *`Node`, e implementa aquelas da interface `ParentNode`.*

`ParentNode.children` (en-US) Somente leitura 
Experimental

Returns a live `HTMLCollection` containing all objects of type `Node` that are children of the `DocumentFragment` object.

`ParentNode.firstElementChild` (en-US) Somente leitura 
Experimental

Returns the `Element` that is the first child of the `DocumentFragment` object, or `null` if there is none.

`ParentNode.lastElementChild` (en-US) Somente leitura 
Experimental

Returns the `Element` that is the last child of the `DocumentFragment` object, or `null` if there is none.

`ParentNode.childElementCount` Somente leitura 
Experimental

Returns an `unsigned long` giving the amount of children that the `DocumentFragment` has.

Construtor
----------

`DocumentFragment()` (en-US) 
Experimental

Retorna um objeto DocumentFragment vazio.

Métodos
-------

*This interface inherits the methods of its parent, `Node`*, and implements those of the `ParentNode` interface.

`DocumentFragment.find()` 
Experimental

Returns the first matching `Element` in the tree of the `DocumentFragment`.

`DocumentFragment.findAll()` 
Experimental

Returns a `NodeList` of matching `Element` in the tree of the `DocumentFragment`.

`DocumentFragment.querySelector()` (en-US)

Returns the first `Element` node within the `DocumentFragment`, in document order, that matches the specified selectors.

`DocumentFragment.querySelectorAll()` (en-US)

Returns a `NodeList` of all the `Element` nodes within the `DocumentFragment` that match the specified selectors.

`DocumentFragment.getElementById()` (en-US)

Returns the first `Element` node within the `DocumentFragment`, in document order, that matches the specified ID.

Especificações
--------------

| Specification |
| --- |
| DOM Standard # interface-documentfragment |

Compatibilidade com navegadores
-------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Veja também
-----------

* The DOM interfaces index. (en-US)
PositionError
=============

A interface **`PositionError`** representa a rasão de um erro ocorrer quando usando o dispositivo de geolocalização.

Propriedades
------------

*A interface `PositionError` não herda nenhuma propriedade*.

`PositionError.code` (en-US) Somente leitura 

Retorna um tipo `unsigned short` representando o código de erro. Os valores possíveis são os seguintes:

| Valor | Constante associada | Descrição |
| --- | --- | --- |
| `1` | `PERMISSION_DENIED` | Não foi possível obter a informação sobre geolocalização por que a página não possuía permissão para fazê-lo. |
| `2` | `POSITION_UNAVAILABLE` | A obtenção da geolocalização falhou por que pelo menos uma fonte interna de posicionamento retornou um erro interno. |
| `3` | `TIMEOUT` | O tempo máximo permitido para obter a geolocalização, definido por `PositionOptions.timeout` (en-US) foi atingido antes de se obter a informação. |

`PositionError.message` (en-US) Somente leitura 

Retorna um `DOMString` humanamente legível descrevendo os detalhes do erro. A especificação observa que esta informação é primariamente projetada para propósitos de debug e não deve ser exibida diretamente na interface com o usuário.

Métodos
-------

**A interface `PositionError` não implementa nem herda qualquer método*.*\*\*

Especificações
--------------

| Specification |
| --- |
| Geolocation API # position\_error\_interface |

Compatibilidade com navegadores
-------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Veja também
-----------

* Usando geolocation (en-US)
* A interface `Geolocation` que o utiliza.
StorageManager
==============

**Secure context:** This feature is available only in secure contexts (en-US) (HTTPS), in some or all supporting browsers.

**Experimental:** **Esta é uma tecnologia experimental (en-US)**  
Verifique a tabela de compatibilidade entre Navegadores cuidadosamente antes de usar essa funcionalidade em produção.

**`StorageManager`** é uma inteface da Storage API (en-US) que fornece uma interface para controlar as permissões de gravações e estima o espaço disponível. Você pode obter a referência desta interface usando `navigator.storage` (en-US) ou `WorkerNavigator.storage` (en-US).

Métodos
-------

`StorageManager.estimate()` (en-US) Secure context

Retorna um objeto `StorageEstimate` (en-US) contendo números de uso e cota para sua origem.

`StorageManager.persist()` (en-US) Secure context

Retorna uma `Promise` que resolve como `true` se o agente de usuário for capaz de gravar o armazenamento do seu site.

`StorageManager.persisted()` (en-US) Secure context

Retorna uma `Promise` que resolve como `true` se alguma gravação já foi concedida para o armazenamento do seu site.

Especificações
--------------

| Specification |
| --- |
| Storage Standard # storagemanager |

Compatibilidade com navegadores
-------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
Coordinates
===========

**Secure context:** This feature is available only in secure contexts (en-US) (HTTPS), in some or all supporting browsers.

O **`Coordinates`** iinterface representa a posição e a altitude do dispositivo na Terra, bem como a precisão com que essas propriedades são calculadas.

Propriedades
------------

*A interface do `Coordinates` não herda nenhuma propiedade*.

`Coordinates.latitude` (en-US) Somente leitura  Secure context

Retorna um `double` representando a latitude da posição em graus decimais.

`Coordinates.longitude` (en-US) Somente leitura  Secure context

Retorna um `double` representando a longitude da posição em graus decimais.

`Coordinates.altitude` Somente leitura  Secure context

Retorna um `double` representando a altitude da posição em metros, em relação ao nível do mar. Esse valor pode ser `null` se a implementação não puder fornecer os dados.

`Coordinates.accuracy` (en-US) Somente leitura  Secure context

Retorna um `double` representação da precisão das propriedades em `latitude` e `longitude`, expressa em metros.

`Coordinates.altitudeAccuracy` (en-US) Somente leitura  Secure context

Retorna um `double` representação da precisão da `altitude` expressa em metros. Esse valor pode ser `null`.

`Coordinates.heading` (en-US) Somente leitura  Secure context

Retorna um `double` representação da direção na qual o dispositivo está viajando. Esse valor, especificado em graus, indica o quão longe do título verdadeiro do norte do dispositivo. `0` representam o verdadeiro norte e a direção é determinada no sentido horário (o que significa que o leste é `90`graus e oeste é `270`graus). Se `speed`é `0`, `heading`é `NaN` (en-US). Se o dispositivo não conseguir fornecer `heading`informações, esse valor é `null`.

`Coordinates.speed` (en-US) Somente leitura  Secure context

Retorna um `double`representação da velocidade do dispositivo em metros por segundo. Esse valor pode ser `null`.

Métodos
-------

**A interface da `Coordinates` *não implementa, nem herda nenhum método.***

Especificações
--------------

| Specification |
| --- |
| Geolocation API # coordinates\_interface |

Compatibilidade com navegadores
-------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Veja também
-----------

* Usando geolocalização
* O `Geolocation` e a interface que o usa.
SVGAnimateTransformElement
==========================

A interface `SVGAnimateTransformElement` corresponde ao elemento `<animateTransform>`.

Propriedades
------------

*Essa interface não possui propriedades próprias mas as herda do seu pai, `SVGAnimationElement` (en-US).*

Métodos
-------

*Essa interface não possui métodos próprios mas os herda do seu pai, `SVGAnimationElement` (en-US).*

Especificações
--------------

| Specification |
| --- |
| SVG Animations Level 2 # InterfaceSVGAnimateTransformElement |

Compatibilidade com navegadores
-------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
SVGAElement
===========

O **`SVGAElement`** interface fornece acesso as propriedades do elemento `<a>`, bem como metodos para manipula-los.Propriedades
------------

*Esta interface também herda propriedades de sua interface pai,`SVGGraphicsElement` (en-US), e implementa propriedades de `SVGURIReference` (en-US) e de `HTMLHyperlinkElementUtils`.*

`SVGAElement.target` Somente leitura 

It corresponds to the `target (en-US)` attribute of the given element.

Metodos
-------

*Esta interface não tem metodos próprios, porém herda metodos da interface `SVGGraphicsElement` (en-US).*

Exemplos
--------

No exemplo abaixo, o `target (en-US)` atributo do elemento `<a>` recebe o valor `_blank` e quando o link for clicado, ele notifica se a condição é verdadeira ou falsa.


```js
var linkRef = document.querySelector("a");
linkRef.target = "\_self";

linkRef.onclick = function () {
  if (linkRef.target === "\_blank") {
    console.log("BLANK!");
    linkRef.target = "\_self";
  } else {
    console.log("SORRY! not \_blank");
  }
};
```

Especificações
--------------

| Specification |
| --- |
| Scalable Vector Graphics (SVG) 2 # InterfaceSVGAElement |

Compatibilidade com navegadores
-------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Veja também
-----------

* SVG `<a>` element
ProcessingInstruction
=====================

Uma **ProcessingInstruction (Instrução de Processamento)** incorpora instruções específicas de aplicações em XML (en-US) que pode ser ignorada por outras aplicações que não as reconhece. Mesmo se um processador XML ignora as instruções de processamento, irá dá-los um lugar no DOM.

Uma instrução de processamento é diferente de uma declaração XML, que fornece informação sobre o documento como por exemplo codificação de caracteres, e pode somente aparecer como o primeiro item em um documento.

Instruções de processamento definidas por usuário não podem começar com `'xml'`, pois estes são reservados (como `<?xml-stylesheet ?>)`.

Instruções de processamento herdam métodos e propriedades do `Node`.

### Atributos

* alvo (DOMString) - depois do `<?` e antes do *whitespace (en-US)* separando-o de `data`.
* dado (DOMString) - primeiro caractere *whitespace* brancodepois de `target` e antes de `?>`
Especificações
--------------

| Specification |
| --- |
| DOM Standard # interface-processinginstruction |

Compatibilidade com navegadores
-------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

### Veja também

* document.createProcessingInstruction
* whitespace no DOM (en-US)
Battery Status API
==================

A **API Battery Status**, mais conhecida como **Battery API**, fornece informações sobre o nível de carga da bateria presente no sistema e permite que você seja notificado por eventos que são enviados quando os níveis sofrem alterações. Isto pode ser usado para ajustar a utilização de recursos do seu aplicativo, reduzindo a quantidade de energia drenada por ele quando a bateria estiver em nível baixo, ou ainda para salvar mudanças antes da bateria acabar, prevenindo a perda de dados.

A API Battery Status API estende `Window.navigator` com uma propriedade `Navigator.battery` que é um objeto `BatteryManager`, e adiciona alguns novos eventos que você pode receber para monitorar o status da bateria.

Exemplo
-------

Neste exemplo, nós observamos as mudanças em ambos os status de carregamento (se estamos ou não conectados e carregando) e para mudanças no nível da bateria. Isto é feito escutando pelos eventos `chargingchange` e `levelchange`, respectivamente.


```js
var battery =
  navigator.battery || navigator.mozBattery || navigator.webkitBattery;

function updateBatteryStatus() {
  console.log("Status da bateria: " + battery.level \* 100 + " %");

  if (battery.charging) {
    console.log("A bateria está carregando");
  }
}

battery.addEventListener("chargingchange", updateBatteryStatus);
battery.addEventListener("levelchange", updateBatteryStatus);
updateBatteryStatus();
```


Veja também o exemplo na especificação.

Especificações
--------------

| Specification |
| --- |
| Battery Status API  |

Compatibilidade com navegadores
-------------------------------

### api.BatteryManager

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

### api.Navigator.getBattery

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Veja também
-----------

* Hacks blog post - Usando a API Battery API (em inglês)
* `BatteryManager`
* `navigator.battery`