5/10/24 es. 5 - consonanti by @sarazani - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

References

autocompleteIndica l'opzione di auto completamento delle aree di input e/o di un form
<ol>Crea liste ordinate o numerate.
styleDefinisce regole e stili CSS all'interno di un tag HTML (inline CSS)
_selfApre collegamenti ipertestuali nella stessa pagina del browser
_blankApre i collegamenti ipertestuali in una nuova scheda del browser
maxlengthDetermina il numero massimo di caratteri consentiti in un elemento input

Users

Log in to search for users

Explore

Find inspiration

LEZIONE 1 BOLLEAN

Tabella Landing page

copia di html typing

TABELLA RIEPILOGATIVA

HTML

CSS

JS

terminal console

feedback

add_box New

cookie Policy

Privacy information and cookies

We use cookies or technologies for technical purposes and, with your consent, also for other purposes as specified in the cookie policy. Refusal of consent may make some functions unavailable. Read more about the privacy policy

Click on “Agree” to confirm.

<!DOCTYPE html>
<html lang="it">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>consonanti</title>
    <!-- Collegamento a Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
</head>
<body>
    <div class="container">
        <h1>Conta le consonanti della frase</h1>
        <!--qui il form che richiamo nel javascript con moduloVocali-->
        <form id="formConsonanti">
            <div class="form-group">
                <label for="inputStringa">Inserisci una frase:</label>
                <!--qui sotto ho l'inputStringa che richiamo poi come valore della costante stringaInserita-->
                <input type="text" class="form-control" id="inputStringa" name="inputStringa" placeholder="Scrivi qui la tua frase">
            </div>
            <button type="submit" class="btn btn-primary">Conta</button>
        </form>
        <!--il risultato poi si ricollega al risultato di Javascritp e viene visualizzato qui-->
        <div id="risultato" class="mt-3"></div>
    </div>

    <!-- Collegamento a jQuery -->
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <!-- Collegamento a JavaScript personalizzato -->
    <script src="script.js"></script>
</body>
</html>

//Chiedi all'utente di inserire una frase in un form. Conta quante consonanti (tutte le lettere dell'alfabeto escluse le vocali) sono presenti nella frase e visualizza il risultato
$(document).ready(function() {
  $('#formConsonanti').submit(function(evento) {
    evento.preventDefault();
    
    const frase = $('#inputStringa').val().toLowerCase();
    //inserisco qui tutte le consonanti (Regex)
    const consonanti = /[bcdfghjklmnpqrstvwxyz]/g;
    //cerco le consonanti che ci sono nella frase messa dall'utente confrontando con quelle messe in regex tramite il match
    let consonantiPresenti = frase.match(consonanti);
    //quelle che trova con length diventano un numero altrimenti mi dava per esempio con "spanna" -> spnn, mentre io volevo 4
    numeroConsonanti=consonantiPresenti.length;
    //se il numero di consonanti è diverso da 0 mi fa vedere quante sono, altrimenti mi dice che non ci sono consonanti
    if(numeroConsonanti!=0){
      //qui ho fatto vedere sia quante sono, sia quali sono. per sistemarle in fila ho usato il join con virgola e spazio altrimenti venivano tutte appiccicate
      $('#risultato').text('Le consonanti nella frase sono: '+ numeroConsonanti +". Le consonanti presenti sono: " + consonantiPresenti.join(", "));
    }else{
      $('#risultato').text("Non ci sono consonanti nella frase.");
    }
  });
});