JavaScript - DOM Acessando o elemento pelo nome (name)

Acessando o elemento pelo seu nome(name)

Olá amigos estamos de volta para falar de DOM (Document Object Model), o DOM ele não roda no Node.Js, somente no Browser.

Portanto nos exemplos desse post iremos usar JavaScript e exibí-los no html, ou seja, no Browser. Conto que você saiba o básico de html para poder rodar os exemplos no seu dispositivo.

No post anterior, nós aprendemos a acessar o elemento pela identificação(ID), agora iremos ao próximo item da lista, acessar pelo nome do elemento.

window.document.getElementsByName('valor do name do elemento')[Valor do índice do elemento]

O código acima é uma função JavaScript que pegará o elemento desejado pelo seu nome, ou seja pelo seu name. Exemplo abaixo:

<p name='texto'>Paragrafo00:</p>

<p name='texto'>Paragrafo01:</p>

Acima temos um elemento paragrafo com o name 'texto', o comando abaixo mostra como acessar esse paragrafo pelo seu nome:

window.document.getElementsByName('texto')[0]---> O valor entre parênteses é o nome do elemento, e o valor entre colchetes é o índice do elemento. Nesse comando, o código dará acesso a todos os elementos 'p' da página, por isso temos que usar o '[]' para saber pelo índice qual elemento vamos alterar seus atributos. Você pode alterar o texto, cores, estilos e muito mais.

Abaixo temos uma imagem de exemplo:

Espero que tenham gostado do post, sigam, compartilhem e comentem. Abraços!!