Desafios 03 | Lógica de programação: praticando com desafios

Desafio 01

if(!Produto || Produto.trim()==='') {
        alert("Selecione um produto que seja válido");
        return;
    }

    if (isNaN(quantidade) || quantidade <= 0){
        alert("Insira uma quantidade válida.");
        return;
    }

Desafio 02 Acabei optando por receber a confirmação e a mensagem por e-mail, com a ajuda da Sarah Ocy Sousa Medeiros, consegui corrigir as falhas e resolver o erro do carregamento infinito (Precisava dar permissão para receber a confirmação dentro do meu E-mail).

Html:

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Formulario da Alura</title>
    <link rel="stylesheet" href="style.css">
    <script defer src = "script.js"></script>
</head>
<body>
    <form id="form" 
    action="https://formsubmit.co/kmg.macedo2305@gmail.com" method="POST"
    data-form>
    

        <label for="nome">Nome</label>
        <input type="text" name="nome" id="nome" required>

        <label for="telefone">Celular</label>
        <input type="tel" name="Celular" id="fone" placeholder="(xx) xxxx-xxxx" required>

        <label for="email">E-mail</label>
        <input type="email" name="email" id="email" required>

        <label for="mensagem">Mensagem</label>

        <textarea name="mensagem" id="mensagem" required></textarea>
        <button type="submit" data-button ;>Enviar</button>
    </form>
</body>
</html>

JavaScipt:

class FormSubit {
    constructor (settings) {
        this.settings = settings;
        this.form = document.querySelector(settings.form);
        this.formButton = document.querySelector(settings.button);
        
        if (this.form) {
            this.url = this.form.getAttribute("action");
        }
    }

    displaySucess() {
        this.form.innerHTML = this.settings.sucess;
    }

    displayError() {
        this.form.innerHTML = this.settings.error;
    }

    init() {
        if(this.form) this.form.addEventListener("submit", (event) => {
            event.preventDefault();
            this.displaySucess();
        });
        return this;
    }
    
}

const formSubmit = new FormSubmit({
    form: "[data-form]" ,
    button: "[data-button]",
    sucess: "<h1 class = 'sucess' >Mensagem enviada!! </h1>",
    error: "<h1 class = 'error' >Não foi possível enviar sua mensagem.</h1>",
}) 
formSubmit.init();

Desafio 03 Usei como inspiração a solução do instrutor e decidi tentar alterar o texto pelo prompt, podendo assim mudar para qualquer texto ao apertar o botão.

HTML:

<!DOCTYPE html>
<html lang="pt-br">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Mundando Paragrafos</title>
  <script defer src = "form.js"></script>
</head>
<body>
  <p id="texto">Oloquinho meu, realizando testes</p>
  <button onclick="mudandoTexto()">Mudar o Texto</button>
</body>
</html>

JavaScript:

function mudandoTexto() {
    const paragrafo = document.getElementById('texto');
    paragrafo.textContent = prompt('Digite o novo Paragrafo');
    
}

Desafio 04

const x = parseInt(prompt("Diga um numero para X"));
const z = parseInt(prompt("Diga um numero para z"));

const soma = x + z ;

const mensagem = `A soma de x: ${x} e de z: ${z} é ${soma}`;

alert(mensagem);

Desafio 05

 const sentença = 'Qual é o valor de um diamante se você não puder vender; E o quão seu talento é significante se ninguém puder o ver?';
 const separador = sentença.split(';');

 alert(separador);

Desafio 06

const numeros = '22 , 32, 45, 10, 66';

const separador = numeros.split(',');

alert(separador);