项目作者: filipecavalc

项目描述 :
Exercício desenvolvido segundo o desafio do modulo 02 das aulas de javascript do curso starter da rocketseat: https://skylab.rocketseat.com.br/journey/starter
高级语言: HTML
项目地址: git://github.com/filipecavalc/desafio-javascript-modulo-02.git
创建时间: 2019-12-16T17:57:33Z
项目社区:https://github.com/filipecavalc/desafio-javascript-modulo-02

开源协议:MIT License

下载


desafio-javascript-modulo-02

https://desafio-javascript-modulo-02.firebaseapp.com/

Exemplo funcionando

Alt Text

Exercícios: Módulo 02

1º exercício

Crie um botão que ao ser clicado cria um novo elemento em tela com a forma de um quadrado
vermelho com 100px de altura e largura. Sempre que o botão for clicado um novo quadrado deve
aparecer na tela.

2º exercício

Utilizando o resultado do primeiro desafio, toda vez que o usuário passar o mouse por cima de
algum quadrado troque sua cor para uma cor aleatória gerada pela função abaixo:

  1. function getRandomColor() {
  2. var letters = "0123456789ABCDEF";
  3. var color = "#";
  4. for (var i = 0; i < 6; i++) {
  5. color += letters[Math.floor(Math.random() * 16)];
  6. }
  7. return color;
  8. }
  9. var newColor = getRandomColor(); // #E943F0

3º exercício

A partir do seguinte vetor:

  1. var nomes = ["Diego", "Gabriel", "Lucas"];

Preencha uma lista (<ul>) no HTML com os itens da seguinte forma:

  • Diego
  • Gabriel
  • Lucas

4º exercício

Seguindo o resultado do exercício anterior adicione um input em tela e um botão como a seguir:

  1. <input type="text" name="nome">
  2. <button onClick="adicionar()">Adicionar</button>

Ao clicar no botão, a função adicionar() deve ser disparada adicionando um novo item a lista de
nomes baseado no nome preenchido no input e renderizando o novo item em tela juntos aos
demais itens anteriores. Além disso, o conteúdo do input deve ser apagado após o clique.