reprograma · HellenRodrigues · Apr 26, 2021
diff --git a/Exercicios/4versao/index.html b/Exercicios/4versao/index.html
@@ -0,0 +1,18 @@
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+    <form action="envio_dados">
+        <input type="text" name="nome" id="nomeDaPessoa" placeholder="Digite o seu nome aqui.">
+        <input type="submit" name="enviar" id="botaoDeEnviar" value="Enviar">
+    </form>
+    <div id="resposta"></div>
+    <script src="./script.js"> </script>
+</body>
+</html>     
diff --git a/Exercicios/4versao/script.js b/Exercicios/4versao/script.js
@@ -0,0 +1,13 @@
+document.querySelector('#botaoDeEnviar').addEventListener('click', function armazenarDados(event) {
+    event.preventDefault();
+
+    let pegaNome = document.getElementById('nomeDaPessoa');
+    let exibeResposta = document.getElementById('resposta');
+
+    if (pegaNome.value === '') {
+        exibeResposta.innerText= 'Por favor, digite o seu nome';
+    } else {
+        exibeResposta.innerHTML = (`${pegaNome.value}, dados salvos com sucesso!`);
+    }
+
+})
diff --git a/Exercicios/5/index.html b/Exercicios/5/index.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>DOM</title>
+    <meta charset="utf-8">
+    <link rel="stylesheet" href="css/style.css">
+  </head>
+  <body>
+    <h1>Venda de apartamentos</h1>
+
+    <div>Apartamento de dois dormitórios, clique e veja o preço:</div>
+    <button id="btnAptoDoisDorm">Clique aqui</button>
+    <div id="precoAptoDoisDorm"></div>
+
+    <div>Apartamento de três dormitórios, clique e veja o preço:</div>
+    <button onclick="mostraPrecoAptoTresDorm()">Clique aqui</button>
+    <div id="precoAptoTresDorm"></div>
+
+    <script src="script.js"></script>
+  </body>
+</html>
diff --git a/Exercicios/5/script.js b/Exercicios/5/script.js
@@ -0,0 +1,18 @@
+function mostraPrecoAptoDoisDorm() {
+
+    //evento de exibição do valor do imóvel
+    let getBotaoApDoisDorm = document.querySelector('#btnAptoDoisDorm');
+
+    getBotaoApDoisDorm.addEventListener('click', function mostraValor () {
+
+      document.getElementById('precoAptoDoisDorm').innerText="Preço do imóvel: R$ 500.000,00";
+
+    })
+
+  };
+
+  function mostraPrecoAptoTresDorm() {
+    document.getElementById('precoAptoTresDorm').innerHTML = " Preço do imóvel: R$ 600.000,00";
+  };
+
+  mostraPrecoAptoDoisDorm();
diff --git a/Exercicios/exercicio teste/index.html b/Exercicios/exercicio teste/index.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Aula JavaScript</title>
+</head>
+<body>
+    <p id="mudanca-texto">Clique no botão para mudar o texto desse parágrafo!</p>
+    <button onclick="alterarTexto()">Clicar</button>
+    <script src="./script.js"></script>
+</body>
+</html>
diff --git a/Exercicios/exercicio teste/script.js b/Exercicios/exercicio teste/script.js
@@ -0,0 +1,4 @@
+function alterarTexto() {
+    const textoAAlterar = document.getElementById("mudanca-texto").innerHTML += " Hello Word";
+    return textoAAlterar;
+}
diff --git a/Exercicios/teste query/index.html b/Exercicios/teste query/index.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="./style.css">
+</head>
+<body>
+    <h1 class="meu-titulo">Olá a todos!</h1>
+
+    <p id="meuNome">Meu nome é Vivian.</p>
+
+    <span>Clique para mudar o background dessa página.</span>
+
+    <button onclick="mudarCor()">Clique aqui</button>
+
+    <script src="./script.js"></script>
+</body>
+</html>
diff --git a/Exercicios/teste query/script.js b/Exercicios/teste query/script.js
@@ -0,0 +1,8 @@
+
+function mudarCor() {
+    const mudaCorTitulo = document.querySelector('.meu-titulo').style.color = "blue";
+
+    const mudaParagrafo = document.querySelector('#meuNome').innerHTML += " E eu tenho 32 anos."
+
+    const mudaSpan = document.querySelector('span').style.textDecoration = "underline";
+}
diff --git a/Exercicios/teste query/style.css b/Exercicios/teste query/style.css
@@ -0,0 +1,3 @@
+* {
+    background-color: lightcoral;
+}
diff --git a/Exercício de Casa/img/e6e48ff71c621a0b61e39025ecdd3912-gpMedium.jpg b/Exercício de Casa/img/e6e48ff71c621a0b61e39025ecdd3912-gpMedium.jpg
diff --git a/Exercício de Casa/index.html b/Exercício de Casa/index.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="pt-br">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Biblioteca</title>
+
+    <link rel="stylesheet" href="./style/style.css">
+
+
+</head>
+
+<body>
+
+    <img class=img src="./img/e6e48ff71c621a0b61e39025ecdd3912-gpMedium.jpg">
+
+        <div class="wrapper"> 
+            <h1 class="news__title" id="formTitle">Sua biblioteca aqui!</h1>
+            <form action="" class="news__form" onsubmit="exibirDados(event)">
+                <div class="news__form-group">
+                    <label for="autor" class="news__label"> Autor </label>
+                    <input type="text" class="news__input" id="author" placeholder="Inserir o nome do autor aqui!">
+                    <label for="titulo" class="news__label" >Titulo </label>
+                    <input type="text" class="news__input" id="titulo" placeholder="Insira o título aqui!">
+                    <label for="isbn" class="news__label" >Isbn </label>
+                    <input type="text" class="news__input" id="isbn" placeholder="Insira o ISBN aqui">
+                    <label for="data-publicacao" class="news__label" >Data de Publicação </label>
+                    <input type="date" class="news__input" id="dataPublicacao">
+                </div>
+                <div class="news__form-group">
+                    <input type="submit" class="button news__button" name="enviar" id="botaoDeEnviar" value="Enviar">
+                 </div>
+                 <div id="resposta" class="resposta__box resposta__list">
+                 </div>
+            </form>
+           </div>              
+        </div>    
+        <script src="script/script.js"></script>
+</body>
+
+</html>
diff --git a/Exercício de Casa/script/script.js b/Exercício de Casa/script/script.js
@@ -0,0 +1,48 @@
+function exibirDados(event){
+    event.preventDefault();
+
+
+    let pegaAutor = document.getElementById('author').value;
+    let pegaTitulo = document.querySelector('#titulo').value;
+    let pegaISBN = document.querySelector('#isbn').value;
+    let pegaDataPublicacao = document.getElementById('dataPublicacao').value;
+    let dataInsercao = new Date().toLocaleDateString('pt-br');
+    let horarioInsercao = new Date(). toLocaleTimeString('pt-br');
+
+
+    if (pegaAutor === "") {
+        alert("Digite o nome do Autor.")
+    } else if (pegaTitulo === "") {
+        alert("Digite o nome do titulo.") 
+    } else if ( pegaISBN === ""){
+        alert("Digite o ISBN.")
+    } else if (pegaDataPublicacao === ""){
+        alert("Digite o dataPublicacao.")
+    } else {
+        document.getElementById('resposta').innerHTML += `
+            <ul>
+                <li> 
+                    <strong> Autor: </strong> ${pegaAutor}, <strong>Título</strong> ${pegaTitulo},
+                    <strong >ISBN </strong> ${pegaISBN}, <strong> Data de Publicação</strong> ${pegaDataPublicacao},
+                    <strong>Data de Ingresso no Sistema</strong> ${dataInsercao}, ${horarioInsercao}
+                    <a href="#" class="delete">Deletar Publicação </a>                
+                </li>
+            </ul>
+
+        `
+        limparDados();
+    }
+}
+
+function limparDados(){
+    document.getElementById('author').value = "";
+    document.querySelector('#titulo').value = "";
+    document.querySelector('#isbn').value = "";
+    document.querySelector('dataPublicacao').value = "";
+}
+
+document.getElementById('resposta').addEventListener('click',function(event){
+    if (event.target.className === "delete") {
+        event.target.parentElement.remove();
+    }
+})
diff --git a/Exercício de Casa/style/style.css b/Exercício de Casa/style/style.css
@@ -0,0 +1,47 @@
+
+
+* {
+    box-sizing: border-box;
+    margin: 0;
+    text-decoration: none;
+    color: inherit;
+    ;
+}
+
+body{
+    background-color: rgba(34, 51, 51, 0.911);
+}
+
+.news__form-group{
+    display:grid;
+    margin: 5%;
+    color: white;
+}
+
+.news__input{
+    margin-bottom: 1%;
+    color: black;
+}
+
+.news__title{
+    text-align: center;
+    margin-top: 3%;
+    color:rgb(255, 255, 255);
+
+}
+
+.button{
+    margin-left: auto;
+    margin-right: auto;
+    color: black;
+}
+
+.img {
+    min-height: 40px;
+    height: 150px;
+    background-size: cover;
+    background-repeat: no-repeat;
+    display: flex;
+    width: 100%;
+    opacity: 61%;
+}