Como alterar a cor de fundo em JavaScript

Como alterar a cor de fundo em JavaScript
HTML, CSS e JavaScript são partes essenciais da construção de um site interativo. A maioria dos desenvolvedores utilizou formatação CSS embutida para implementar estilos nas tags de elemento HTML. Um deles, um atributo de estilo, tem sua própria importância em Mudando a cor do fundo de elementos html. É implementado em vários elementos, como títulos, parágrafos, mesas, ou Páginas inteiras. Este atributo de estilo também pode ser utilizado via JavaScript também. Este artigo demonstra como alterar a cor de fundo em JavaScript.

Como alterar a cor de fundo em JavaScript?

A propriedade "cor de fundo" é empregado para devolver a cor do elemento especificado. Os usuários podem acessar o elemento HTML e depois aplicar esta propriedade para alterar a cor do fundo. A sintaxe é dada aqui atribuindo a cor de fundo em JavaScript.

Sintaxe

objeto.estilo.BackgroundColor = "Color"

Nesta sintaxe, “cor”Representa o valor da cor a ser atribuído ao "cor de fundo" propriedade de um html objeto.

Observação: Os usuários podem especificar "cor”Como o nome da cor, valores de RGB ou códigos de cores hexadecipais.

Exemplo 1: Altere a cor de fundo da área especificada em JavaScript

Um exemplo é adaptado para alterar a cor de fundo de uma área especificada. O código de exemplo a seguir refere -se a alterar a cor de fundo do div, tendo “Id = txt”:

Código



Um exemplo para mudar a cor de fundo


Bem -vindo ao JavaScript



Neste código:

  • Uma área específica é alocada por > Tags e uma mensagem “Bem -vindo ao JavaScript” está escrito nele.
  • A "Botão" está anexado com o “Col ()” método que é desencadeado pressionando -o.
  • No “Col ()” método, documento.getElementById extrai o valor do elemento div ter “Id = txt” e seu valor é armazenado em uma variável chamada “ucol““.
  • finalmente, o "estilo.cor de fundo" A propriedade é empregada para alterar a cor de fundo atribuindo “amarelo".

Saída

A saída mostra que, pressionando o botão, a cor de fundo da mensagem é alterada.

Exemplo 2: Altere a cor de fundo de toda a página em JavaScript

Outro exemplo é alterar a cor completa de fundo de uma página da web para azul Utilizando o Código Hex #0000FF. O código a seguir refere -se ao cenário declarado acima:

Código



Bem -vindo ao Linuxhint





O código é demonstrado como:

  • Um botão “Mudar a cor de fundo” é empregado, que está associado a um “Myfun ()” método.
  • Em “Myfun ()”, a propriedade de estilo “cor de fundo" está configurado para “ #0000FF” Como um código hexadecimal.
  • O “Myfun ()” o método é acionado no “OnClick” pressionando o botão.

Saída

A saída mostra que a cor do fundo é alterada de branco para azul pressionando o botão na janela do navegador.

Conclusão

Em JavaScript, o estilo.BackgroundColoA propriedade r é utilizada para alterar a cor de fundo. O valor da cor pode estar em RGB, código hexadecimal ou seu nome. Neste artigo, dois exemplos são fornecidos para alterar a cor de fundo pelo nome e o código hexadecimal de uma área específica, bem como toda a página. O cor de fundo A propriedade é útil para alterar a cor de fundo dos títulos, tabelas ou quaisquer elementos especificados.