Programação  
 
Conhecimento computador >> Programação >> JavaScript Programação >> 
Como atualizar DIV
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:


< /div >


< botão type = class = " botão" " botão " onclick = " changeColor ()" > Alterar cor < /button>
3

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 :

< tipo de script = "text /javascript " >

função changeText () {

document.getElementById ( " sampleDiv " ) firstChild.nodeValue = " Você adicionou texto com sucesso." ; .

} < br > função

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 :




Anterior :

Próximo : No
  Os artigos relacionados
·Como desativar Rolagem no Google Maps API V3 
·Como remover jQuery Accordion Styling 
·Como usar um Lightbox em JavaScript 
·Vantagens Jquery 
·Como usar uma String em VBScript 
·Como acessar o acelerômetro Via Javascript no Android 
·Como colocar Declarações condicionais em um arquivo J…
·Como deixar cair Decimals Usando JavaScript 
·Definição de variável existe no JavaScript 
·Como remover um manipulador de eventos em TinyMCE 
  Artigos em destaque
·Funções static void em C 
·Como fazer um RadGrid Fade in uma Animação 
·Facelet Vs . JSP 
·Como a transferência do microcontroladores para PCs 
·Um tutorial para a criação de um banco de dados relac…
·Como converter um alfabeto em Caps no CPP 
·Como usar Libra com SSL 
·Como encontrar o Maior Número de Java 
·Como Ler 2D Arrays no XML em um aplicativo Android 
·Como matar C + + sintaxe 
Cop e direita © Conhecimento computador http://ptcomputador.com Todos os Direitos Reservados