recursal/MDN huggingface dataset:
FileList
========

Um objeto desse tipo é retornado pela propriedade `files` do elemento HTML `<input>`; isso permite acessar a lista de arquivos selecionados com o elemento `<input type="file">`. Também é usado para uma lista de arquivos soltos no conteúdo web usando a API drag and drop; consulte o objeto `DataTransfer` (en-US) para detalhes de seu uso.

**Nota:** Antes do Gecko 1.9.2, o elemento input suportava apenas um arquivo selecionado por vez, ou seja, o array FileList conteria apenas um arquivo. A partir do Gecko 1.9.2, se o atributo multiple do elemento for definido, FileList pode conter múltiplos arquivos.

Utilizando a lista de arquivos
------------------------------

Todo elemento `<input>` possui um array `files` que permite o acesso aos seus arquivos. Por exemplo, se o HTML inclui o seguinte elemento:
```

<input id="fileItem" type="file">
```


O código a seguir acessa o primeiro elemento da lista de arquivos como um objeto `File` (en-US):


```js
var file = document.getElementById("fileItem").files[0];
```

Visão geral dos métodos
-----------------------

| `File item(index);` |
| --- |

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

| Atributo | Tipo | Descrição |
| --- | --- | --- |
| `length` | `integer` | Valor somente-leitura que indica o número de arquivos na lista. |

Métodos
-------

### item()

Retorna um objeto `File` (en-US) representando o arquivo no índice especificado na lista.
```

 File item(
   index
 );
```


###### Parâmetros

`index`

O índice (baseado em zero) do arquivo a ser recuperado da lista.

###### Valor de retorno

O objeto `File` (en-US) representando o arquivo requisitado.

Exemplo
-------

Este exemplo itera por todos os arquivos selecionados pelo usuário em um elemento `input`:


```js
// fileInput é um elemento HTML input: <input type="file" id="myfileinput" multiple>
var fileInput = document.getElementById("myfileinput");

// files é um objeto FileList (similar ao NodeList)
var files = fileInput.files;
var file;

// percorre os arquivos
for (var i = 0; i < files.length; i++) {
  // obtém o item
  file = files.item(i);
  // ou
  file = files[i];

  alert(file.name);
}
```


A seguir, um exemplo completo.


```html
<!doctype html>
<html>
  <head> </head>

  <body>
    <!--multiple é definido para que múltiplos arquivos possam ser selecionados-->

    <input id="myfiles" multiple type="file" />
  </body>

  <script>
 var puxarArquivos = function () {
 var fileInput = document.querySelector("#myfiles");
 var files = fileInput.files;

 for (var i = 0; i < files.length; i++) {
 var file = files[i];
 alert(file.name);
 }
 };

 // seta o 'onchange' do elemento input para chamar a função puxarArquivos
 document.querySelector("#myfiles").onchange = puxarArquivos;
 </script>
</html>
```

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

| Specification |
| --- |
| File API # filelist-section |
| HTML Standard # dom-input-files-dev |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
WindowTimers.clearTimeout()
===========================

Sumário
-------

O método **`clearTimeout()`** do escopo `WindowOrWorkerGlobalScope` cancela um *timeout* previamente estabelecido pela função `setTimeout()` (en-US).

Síntaxe
-------
```

escopo.clearTimeout(timeoutID)
```

### Parâmetros

`timeoutID`

O ID do *timeout* que você deseja cancelar. Esse ID é o retorno da função `setTimeout()`.

É interessante ressaltar que os conjuntso de *IDs* usados pelos métodos `setTimeout()` (en-US) e `setInterval()` são compartilhados, o que significa que `clearTimeout()` e `clearInterval()` (en-US) podem ser tecnicamente utilizados de forma intercambiável. No entanto, para obter-se maior clareza, isso deve ser evitado.

Exemplo
-------

Execute o script abaixo em uma página web e clique na página uma vez. Você verá uma mensagem aparecer um segundo depois. Se você continuar clicando na página várias vezes nesse intervalo de tempo, a mensagem aparecerá uma única vez.


```js
var alarme = {
  relembrar: function (aMessage) {
    alert(aMessage);
    delete this.timeoutID;
  },

  setup: function () {
    if (typeof this.timeoutID === "number") {
      this.cancelar();
    }

    this.timeoutID = window.setTimeout(
      function (msg) {
        this.relembrar(msg);
      }.bind(this),
      1000,
      "Wake up!",
    );
  },

  cancelar: function () {
    window.clearTimeout(this.timeoutID);
  },
};
window.onclick = function () {
  alarme.setup();
};
```

Notas
-----

Passar um *ID* inválido para `clearTimeout` não causa nenhum efeito (não lança nenhuma exceção).

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

| Specification |
| --- |
| HTML Standard # dom-cleartimeout-dev |

Compatibilidade
---------------

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

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

* `WindowOrWorkerGlobalScope.setTimeout()` (en-US)
* `WindowOrWorkerGlobalScope.setInterval()`
* `WindowOrWorkerGlobalScope.clearInterval()` (en-US)
* `Window.requestAnimationFrame()`
* *Daemons* management
A API de informações de rede
============================

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

 A API de informações de rede fornece informações sobre a conexão do sistema em termos de tipo de conexão geral (por exemplo, 'wifi, 'celular' etc.).
 Isso pode ser usado para selecionar conteúdo de alta definição ou conteúdo de baixa definição com base na conexão do usuário.

A interface consiste em um único objeto `NetworkInformation` (en-US), cuja instância é retornada pela propriedade `Navigator.connection` (en-US).

**Note:** This feature is available in Web Workers

Interfaces
----------

`NetworkInformation` (en-US)

fornece informações sobre a conexão que um dispositivo está usando para se comunicar com a rede e fornece um meio para que os scripts sejam notificados se o tipo de conexão for alterado. A interface `NetworkInformation` não pode ser instanciada. Em vez disso, é acessado através da interface `Navigator` (en-US).

Exemplos
--------

### Detectar alterações de conexão

Este exemplo observa as alterações na conexão do usuário.


```js
let type = navigator.connection.effectiveType;

function updateConnectionStatus() {
  console.log(
    `Tipo de conexão alterado de ${type} para ${navigator.connection.effectiveType}`,
  );
  type = navigator.connection.effectiveType;
}

navigator.connection.addEventListener("change", updateConnectionStatus);
```

### Pré-carregue grandes recursos

O objeto de conexão é útil para decidir se deve pré-carregar recursos que consomem grandes quantidades de largura de banda ou memória. Este exemplo seria chamado logo após o carregamento da página para verificar um tipo de conexão em que o pré-carregamento de um vídeo pode não ser desejável. Se uma conexão de celular for encontrada, o sinalizador `preloadVideo` será definido como `false`. Para simplicidade e clareza, este exemplo testa apenas um tipo de conexão. Um caso de uso do mundo real provavelmente usaria uma instrução switch ou algum outro método para verificar todos os valores possíveis de `NetworkInformation.type` (en-US). Independentemente do valor `type`, você pode obter uma estimativa da velocidade da conexão através da propriedade `NetworkInformation.effectiveType` (en-US).


```js
let preloadVideo = true;
const connection = navigator.connection;
if (connection) {
  if (connection.effectiveType === "slow-2g") {
    preloadVideo = false;
  }
}
```

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

| Specification |
| --- |
| Network Information API # networkinformation-interface |
| Network Information API # connection-attribute |

Compatibilidade do navegador
----------------------------

### api.NetworkInformation

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

### api.Navigator.connection

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

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

* Eventos online e offline (en-US)
ANGLE\_instanced\_arrays
========================

A extenção **`ANGLE_instanced_arrays`** é parte do WebGL API e permite desenhar o mesmo objeto, ou grupos de objectos semelhantes várias vezes, se eles compartilham os mesmos dados de vértice, contagem primitiva e tipo.

As extensões WebGL estão disponíveis usando o método `WebGLRenderingContext.getExtension()` (en-US). Para mais informações, veja também Usando Extenções (en-US) no WebGL tutorial (en-US).

**Nota:** **Disponibilidade:** Esta extenção só está disponível para contextos WebGL1 (en-US). Em WebGL2 (en-US), a funcionalidade desta extenção está disponível no contexto WebGL2 por padrão e as constantes e métodos estao disponíveis sem o sufixo "`ANGLE`".

Apesar do nome "ANGLE", esta extenção funciona em qualquer dispositivo se o hardware oferece suporte a ele e não apenas no Windows ao usar a biblioteca ANGLE. "ANGLE" apenas indica que essa extencão foi escrita pelos autores da biblioteca ANGLE.

Constantes
----------

Essa extensão expõe uma nova constante, que pode ser usada no método `gl.getVertexAttrib()` (en-US):

`ext.VERTEX_ATTRIB_ARRAY_DIVISOR_ANGLE`

Retorna um `GLint` (en-US) descrevendo o divisor de frequência usado para renderização instanciada quando usado no `gl.getVertexAttrib()` (en-US) como parâmetro `pname`.

Métodos
-------

Essa extensão expõe três novos métodos.

`ext.drawArraysInstancedANGLE()` (en-US)

Se comporta de forma idêntica a `gl.drawArrays()` (en-US) exceto que múltiplo instâncias do intervalo de elementos são executadas e a instância avança para cada iteração.

`ext.drawElementsInstancedANGLE()` (en-US)

Comporta-se de forma idêntica para o `gl.drawElements()` (en-US) exceto que várias instâncias do conjunto de elementos são executadas e a instância avança entre cada conjunto.

`ext.vertexAttribDivisorANGLE()` (en-US)

Modifica a taxa na qual os atributos de vértice genéricos avançam ao renderizar várias instâncias de primitivos com `ext.drawArraysInstancedANGLE()` (en-US) e `ext.drawElementsInstancedANGLE()` (en-US).

Exemplos
--------

Habilitando a extenção:


```js
var ext = gl.getExtension("ANGLE\_instanced\_arrays");
```

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

| Specification |
| --- |
| WebGL ANGLE\_instanced\_arrays Khronos Ratified Extension Specification  |

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

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

Ver também
----------

* `WebGLRenderingContext.getExtension()` (en-US)
* `WebGL2RenderingContext.drawArraysInstanced()` (en-US)
* `WebGL2RenderingContext.drawElementsInstanced()` (en-US)
* `WebGL2RenderingContext.vertexAttribDivisor()` (en-US)
Gamepad API
===========

A **Gamepad API** é uma maneira dos desenvolvedores acessarem e responderem à sinais oriundos de gamepads e outros controladores de games de forma simples e consistente. A API contém três interfaces, dois eventos e uma função especialista, para responder aos gamepads sendo conectados e desconectados, e acessar outras informações sobre o próprio gamepad, e quais botões e outros controles estão sendo de fato passados.

Interfaces
----------

`Gamepad` (en-US)

Representa o gamepad/controlador conectado ao computador.

`GamepadButton` (en-US)

Representa um botão num dos controles conectados.

`GamepadEvent` (en-US)

O objeto de evento representando eventos disparados que são relacionados ao gamepad.

### Experimental Gamepad extensions

`GamepadHapticActuator` (en-US)

Representa o hardware no controlador designado à prover feedbacks táteis ao usuário (Se disponível), mais comumente um hardware de vibração.

`GamepadPose` (en-US)

Representa a "localização" de um controle (ex. posição e orientação no espaço 3D) no caso de um controlador WebVR.

Veja também as extensões para a interface de Gamepad (en-US), para funcionalidades que permitem você acessar as informações acima.

### Extensions to other interfaces

#### Navigator

`Navigator.getGamepads()` (en-US)

Uma extensão para o objeto `Navigator` (en-US) que retorna um array de objetos `Gamepad` (en-US), um para cada controlador conectado.

#### Window events

`Window.ongamepadconnected` (en-US)

Representa um controlador de evento que irá rodar quando o gamepad é conectado (quando o evento `gamepadconnected (en-US)` for disparado).

`Window.ongamepaddisconnected` (en-US)

Representa um controlador de evento que irá rodar quando o gamepad é desconectado (quando o evento `gamepaddisconnected (en-US)` for disparado).

Guias e tutorias
----------------

* Using the Gamepad API (en-US)
* Implementing controls using the Gamepad API (en-US)
Especificações
--------------

| Specification |
| --- |
| Gamepad # gamepad-interface |
| Gamepad Extensions # partial-gamepad-interface |

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

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

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

* The Gamepad API por Ted Mielczarek and Robert Nyman
* Simple API demo page (source)
Position
========

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

A interface **`Position`** representa a posição do dispositivo em questão em um dado momento. A posição, representada por um objeto `Coordinates`, compreende a posição 2D do dispositivo, em um esferóide representando a Terra, e também inclui sua altitude e velocidade.

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

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

`Position.coords` Somente leitura  Secure context

Retorna um objeto `Coordinates` definindo a localização atual.

`Position.timestamp` (en-US) Somente leitura  Secure context

Retorna um `DOMTimeStamp` (en-US) representando o momento em que a localização foi detectada.

Métodos
-------

**A inteface `Position` não implementa ou herda nenhum método*.*\*\*

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

| Specification |
| --- |
| Geolocation API # position\_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 (en-US)
* A interface `Geolocation` que usa isto
BroadcastChannel
================

Baseline 2022
-------------

Newly availableSince March 2022, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

* Learn more
* See full compatibility
* Report feedback
A interface **`BroadcastChannel`** representa um canal com um nome em que qualquer browsing context (en-US) (contexto de navegação) de uma determinada origin (origem) pode assinar. Permite a comunicação entre diferentes documentos (em diferentes janelas, abas, frames ou iframes) da mesma *origin*. As mensagens são transmitidas através de um evento `message` acionado em todos objetos do tipo `BroadcastChannel` que estão ouvindo o canal.

**Note:** This feature is available in Web Workers

Construtor
----------

`BroadcastChannel()` (en-US)

Cria um objeto, no qual faz o vínculo com um canal nomeado.

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

*Essa interface também herda propriedades de seu pai, `EventTarget`.*

`BroadcastChannel.name` (en-US)

Retorna um `DOMString`, o nome do canal.

### Event handlers

`BroadcastChannel.onmessage` (en-US)

Uma propriedade `event handler` que específica a função a ser executada quando um evento `message` é acionado a este objeto.

`BroadcastChannel.onmessageerror` (en-US)

Uma chamada `event handler` quando um `MessageEvent` (en-US) do tipo `MessageError` é disparado - isto é, quando recebe uma mensagem que não pode ser desserializada.

Métodos
-------

*Essa interface também herda métodos de seu pai, `EventTarget`.*

`BroadcastChannel.postMessage()` (en-US)

Envia a mensagem, de qualquer tipo de objeto, para cada objeto `BroadcastChannel` ouvindo o mesmo canal.

`BroadcastChannel.close()` (en-US)

Fecha o objeto do canal, indicando que ele não receberá novas mensagens e eventualmente será descartado.

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

| Specification |
| --- |
| HTML Standard # broadcasting-to-other-browsing-contexts |

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

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

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

* Outra forma mais pesada de comunicação entre *browser contexts*: `ServiceWorker` (en-US).
* Visão geral de Broadcast Channel API (en-US)
CharacterData
=============

A interface abstrata **CharacterData** representa um objeto `Node` que contém caracteres. Esta é uma interface abstrata, o que significa que não há nenhum objeto do tipo `CharacterData`: ela é implementada por outras interfaces, como `Text` (en-US), `Comment` (en-US) ou `ProcessingInstruction`, que não são abstratas.

EventTarget

Node

CharacterDataPropriedades
------------

*Herda propriedades de seu pai, `Node`, e implementa as interfaces `ChildNode` e `NonDocumentTypeChildNode` (en-US).*

`CharacterData.data` (en-US)

É um `DOMString` representando os dados textuais contidos neste objeto.

`CharacterData.length` (en-US) Somente leitura 

Retorna um `unsigned long` representando o tamanho da string contida em `CharacterData.data`.

`NonDocumentTypeChildNode.nextElementSibling` (en-US) Somente leitura 

Returns the `Element` immediately following the specified one in its parent's children list, or `null` if the specified element is the last one in the list.

`NonDocumentTypeChildNode.previousElementSibling` (en-US) Somente leitura 

Returns the `Element` immediately prior to the specified one in its parent's children list, or `null` if the specified element is the first one in the list.

Methods
-------

*Inherits methods from its parent, `Node`, and implements the `ChildNode` and `NonDocumentTypeChildNode` (en-US)* interface.

`CharacterData.appendData()` (en-US)

Appends the given `DOMString` to the `CharacterData.data` string; when this method returns, `data` contains the concatenated `DOMString`.

`CharacterData.deleteData()` (en-US)

Removes the specified amount of characters, starting at the specified offset, from the `CharacterData.data` string; when this method returns, `data` contains the shortened `DOMString`.

`CharacterData.insertData()` (en-US)

Inserts the specified characters, at the specified offset, in the `CharacterData.data` string; when this method returns, `data` contains the modified `DOMString`.

`ChildNode.remove()` (en-US) 
Experimental

Removes the object from its parent children list.

`CharacterData.replaceData()` (en-US)

Replaces the specified amount of characters, starting at the specified offset, with the specified `DOMString`; when this method returns, `data` contains the modified `DOMString`.

`CharacterData.substringData()` (en-US)

Returns a `DOMString` containing the part of `CharacterData.data` of the specified length and starting at the specified offset.

Specifications
--------------

| Specification |
| --- |
| DOM Standard # interface-characterdata |

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

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

See also
--------

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

A interface IDBFactory, pertencente a IndexedDB API , permite que aplicativos acessem de forma assíncrona os bancos de dados indexados. O objeto que implementa a interface é o window.indexedDB, com este objeto é possível criar, acessar, modificar e excluir informações de um banco de dados.

**Note:** This feature is available in Web Workers

Métodos
-------

`IDBFactory.open` (en-US)

Realizar a abertura de uma conexão com uma base de dados.

`IDBFactory.deleteDatabase` (en-US)

Remove uma base de dados.

`IDBFactory.cmp` (en-US)

Compara dois valores chaves e determina se elas são iguais e se não, quem é a maior.

### Métodos Obsoletos

`IDBFactory.open` (en-US), a versão original

Este método realizava conexão com uma base de dados, ele ainda é usado em alguns navegadores.

Exemplo
-------

No código abaixo, realizamos uma conexão com um banco de dados e incluímos manipuladores para os casos de sucesso e erro. Você pode obter o To-do Notifications app como exemplo (Visualizar exemplo.)


```js
var note = document.querySelector("ul");

// In the following line, you should include the prefixes of implementations you want to test.
window.indexedDB =
  window.indexedDB ||
  window.mozIndexedDB ||
  window.webkitIndexedDB ||
  window.msIndexedDB;
// DON'T use "var indexedDB = ..." if you're not in a function.
// Moreover, you may need references to some window.IDB\* objects:
window.IDBTransaction =
  window.IDBTransaction ||
  window.webkitIDBTransaction ||
  window.msIDBTransaction;
window.IDBKeyRange =
  window.IDBKeyRange || window.webkitIDBKeyRange || window.msIDBKeyRange;
// (Mozilla has never prefixed these objects, so we don't need window.mozIDB\*)

// Let us open version 4 of our database
var DBOpenRequest = window.indexedDB.open("toDoList", 4);

// these two event handlers act on the database being opened successfully, or not
DBOpenRequest.onerror = function (event) {
  note.innerHTML += "<li>Error loading database.</li>";
};

DBOpenRequest.onsuccess = function (event) {
  note.innerHTML += "<li>Database initialised.</li>";

  // store the result of opening the database in the db variable. This is used a lot later on, for opening transactions and suchlike.
  db = DBOpenRequest.result;
};
```

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

| Specification |
| --- |
| Indexed Database API 3.0 # factory-interface |

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

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

See also
--------

* Usando IndexedDB
* Inicializando uma Transaction: `IDBDatabase` (en-US)
* Usando uma Transaction: `IDBTransaction` (en-US)
* Configurando um Intervalo de chaves: `IDBKeyRange` (en-US)
* Recuperando e modificando dados: `IDBObjectStore` (en-US)
* Usando cursors: `IDBCursor`
* Exemplo de referência: To-do Notifications (Visualizar exemplo.)