Como alterar um elemento cor de fundo em javascript

Usando JavaScript, pode ser necessário destacar alguns dados ou um elemento em sua página da web. Além disso, aumenta a visibilidade do elemento usando cores diferentes e torna a página geral da web mais atraente. Nesses casos, adicionar e alterar a cor de fundo de um elemento é muito eficaz para chamar a atenção do leitor e melhorar o design do site.

Este artigo o guiará a alterar o fundo do elemento em JavaScript.

Como alterar um elemento cor de fundo em javascript?

Para alterar a cor de fundo de um elemento em JavaScript, aplique as seguintes técnicas:

• Propriedade de BackgroundColor com cor
• Propriedade de BackgroundColor com código de cores

As abordagens mencionadas serão demonstradas uma a uma!

Método 1: Altere uma cor de fundo do elemento em JavaScript usando a propriedade BackgroundColor com a cor

O "cor de fundo”Propriedade define a cor de fundo do elemento especificado. Esta propriedade pode ser implementada em qualquer um dos elementos HTM adicionados acessando seu ID e atribuindo -o a uma cor de fundo.

Sintaxe

Aqui o "objeto”Refere -se ao elemento sobre o qual a cor do fundo será aplicada.

O exemplo a seguir explica o conceito declarado.

Exemplo

No exemplo abaixo, a tag de cabeçalho receberá um ID chamado “eu ia" e a "Cor de fundo!" valor:

Em seguida, no arquivo JavaScript, o “documento.getElementById ()”O método acessará o“eu ia”Do elemento de cabeçalho. Depois disso, a propriedade BackgroundColor atribuirá o valor da cor “Luz verde”Contra o ID, que se refere ao valor do cabeçalho especificado na etapa anterior:

A saída da implementação acima resultará da seguinte maneira:

Na saída, observa -se que a cor do plano de fundo é aplicada apenas ao elemento de cabeçalho selecionado.

Método 2: Altere uma cor de fundo do elemento em JavaScript usando a propriedade BackgroundColor com código de cor

Como discutido anteriormente, o “cor de fundo”Propriedade define a cor de fundo do elemento especificado. Esta propriedade também pode ser implementada no elemento especificado usando o código de cores RGB.

Veja o exemplo a seguir para demonstração:

Exemplo

Em primeiro lugar, adicionaremos um parágrafo usando o

Tag e atribua um ID chamado “eu ia”E um valor como mostrado abaixo:

Em seguida, o “getElementById ()”O método acessará da mesma forma o elemento de parágrafo com o ID especificado e atribuirá a cor do plano de fundo usando a propriedade BackgroundColor. Aqui, "#090”Indica o“Rgb”Código de tom escuro médio de cor verde:

Saída

Na implementação acima, a cor verde é resultado de “RGB-> 090”, Em que 9 se refere à intensidade da cor verde.

Conclusão

Para alterar a cor de fundo de um elemento em JavaScript, o “cor de fundo”Propriedade com o método de cor pode ser utilizada para acessar o ID específico e atribuir uma cor de fundo específica. É usado com o “Rgb”Código para aplicar um tom específico de cor ao elemento HTML selecionado. Este artigo guiado relacionado ao método de alterar a cor de fundo do elemento em JavaScript.