Divs substituíram tabelas como a estrutura por trás de design do site. Você pode usar divs para armazenar conteúdo , como texto, imagens e multimídia. Estas divs pode mudar com base na interação do usuário com a página. Por exemplo, clicar em um botão pode mudar o texto no div ou alterar a cor da div . Você pode digitar o código para criar os dois efeitos . Instruções 1
Abra um documento HTML existente ou criar um novo em seu editor de texto . 2
Inserir uma div vazia com o ID de " sampleDiv " e dois botões com a classe de " botão" entre as tags
e . Os botões irá acionar as funções de JavaScript chamado " changeText " e " changeColor " como abaixo:
Insira o seguinte estilo para a div e botões entre as tags
e no documento HTML. Faça o div 200 pixels de largura por 50 pixels de profundidade com uma borda preta . Adicione um pouco de enchimento para os botões. Criar um estilo para uma classe chamada " RedColor " que muda a cor de um elemento de fundo para
4
Insira as seguintes funções JavaScript abaixo os estilos :
changeColor () primeira função adiciona texto para a div . A segunda muda de cor , adicionando a classe de " RedColor ", que aplica o estilo " RedColor " . 5
Salve o documento HTML e abri-lo no seu navegador. Clique em cada botão para observar o efeito pretendido . O código completo vai aparecer da seguinte forma :