Element: método setAttribute()
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since julho de 2015.
O método setAttribute() da interface Element define o valor de um atributo no elemento especificado. Se o atributo já existir, o valor será atualizado; caso contrário, um novo atributo será adicionado com o nome e valor especificados.
Para obter o valor atual de um atributo, use getAttribute(); para remover um atributo, chame removeAttribute().
Se você precisar trabalhar com o nó Attr (como clonar de outro elemento) antes de adicioná-lo, você pode usar o nó setAttributeNode() método em vez disso.
Sintaxe
setAttribute(name, value)
Parâmetros
name-
Uma string especificando o nome do atributo cujo valor deve ser definido. O nome do atributo é automaticamente convertido para letras minúsculas quando
setAttribute()é chamado em um elemento HTML em um documento HTML. value-
Uma string contendo o valor a ser atribuído ao atributo.Qualquer valor não-string especificado é convertido automaticamente em uma string.
Atributos booleanos são considerados true se estiverem presentes no elemento em tudo. Você deve definir value para a string vazia ("") ou o nome do atributo, sem espaços em branco à esquerda ou à direita. Veja o exemplo abaixo para uma demonstração prática.
Como o value especificado é convertido em uma string, especificando null não necessariamente faz o que você espera. Em vez de remover o atributo ou definindo seu valor como null, em vez disso, ele define o valor do atributo para a string "null". Se você deseja remover um atributo, chame removeAttribute().
Valor de retorno
None (undefined).
Exceções
InvalidCharacterErrorDOMException-
Lançado se o valor
namenão for um [nome XML](https://www.w3.org/TR/REC-xml/#dt-name válido); por exemplo, começa com um número, um hífen ou um ponto, ou contém caracteres diferentes de caracteres alfanuméricos, sublinhados, hifens ou pontos.
Exemplo
No exemplo a seguir, setAttribute() é usado para definir atributos em um <button>.
<button>Hello World</button>
JavaScript
const button = document.querySelector("button");
button.setAttribute("name", "helloButton");
button.setAttribute("disabled", "");
Isso demonstra duas coisas:
- A primeira chamada para
setAttribute()acima mostra a alteração do valor do atributonamepara "helloButton". Você pode ver isso usando o inspetor de páginas do seu navegador (Chrome, Edge, Firefox, Safari). - Para definir o valor de um atributo booleano, como
disabled, você pode especificar qualquer valor. Uma string vazia ou o nome do atributo são valores recomendados. Tudo o que importa é que se o atributo estiver presente, independentemente do seu valor real, o seu valor é considerado 'verdadeiro'. A ausência do atributo significa que seu valor éfalse. Ao definir o valor do atributodisabledpara a string vazia (""), estamos definindodisabledcomotrue, o que resulta na desativação do botão.
Especificações
| Specification |
|---|
| DOM> # ref-for-dom-element-setattribute①> |
Compatibilidade de navegadores
Loading…