Git Product home page Git Product logo

fernanda1102 / manipulandodom Goto Github PK

View Code? Open in Web Editor NEW
0.0 1.0 0.0 1.51 MB

Busca os elementos e interage com ele, manipula o evento de clique no elemento para usar duas funções diferentes, uma para atualizar as engrenagens e outra para atualizar as estatísticas do robô.

CSS 39.03% HTML 48.06% JavaScript 12.91%
addeventlistener array arrow-functions data-attributes foreach hoisting html-css-javascript parentnode queryselector queryselectorall

manipulandodom's Introduction

Manipulando o DOM

Badge em Desenvolvimento GitHub Org's stars

Índice

🛠️ Descrição do projeto

Projeto em desenvolvimento para interagir com o JavaScript, tendo um avanço para melhor entendimento de como funciona o JavaScript. Buscando os elementos e interagindo com ele, manipulamos o evento de clique no elemento para usarmos duas funções diferentes, uma para atualizar as engrenagens e outra para atualizar as estatísticas do robô.

🛠️ Funcionalidades do projeto

  • Funcionalidade 1: Aumentar a força do robô
  • Funcionalidade 2: Diminuir a força do robô
  • Funcionalidade 3: Manipulando a força de acordo com as estatística fornecidas

📁 Acesso ao projeto

Indique como é possível baixar ou acessar o código fonte do projeto, seja projeto inicial ou final

🛠️ Abrir e rodar o projeto

Apresente as instruções necessárias para abrir e executar o projeto

🛠️ Processo de evolução do projeto

Etapa 1

• Desenvolvemos os primeiros passos do projeto Robotron 2030;

• Definimos o que é o DOM;

• Aprendemos como manipular elementos no DOM.

Etapa 2

• Aprendemos a selecionar um ou mais elementos com querySelector()/querySelectorAll();

• Aprendemos como utilizar o método addEventListener();

• Definimos as diferenças entre função anônima e função;

• Entendemos o comportamento de hoisting no JavaScript;

Etapa 3

• Definimos o que é Array e como manipular seus objetos;

• Como utilizar arrow functions;

• Como utilizar o método splice() para remover itens.

Etapa 4

• Aprendemos como utilizar a propriedade parentNode;

• Definimos o que é data-attributes;

• Criamos funções para manipular elementos no DOM com data-attributes.

Etapa 5

• Definimos o que são objetos e analisamos métodos para manipulá-los;

• Refatoramos o código do projeto, aprendendo como manipular arrays e utilizando forEach;

• Aprendemos como aplicar projetos na nuvem utilizando vercel e github.

🛠️ Ferramentas utilizadas

Desenvolvedores do Projeto


Fernanda Corredera

manipulandodom's People

Contributors

fernanda1102 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.