JSFiddle - React, Tailwind, and code Playground

by micmic

HTML

<input type="button" value="nombre d'entrée dans le tableau" onclick="nombre()" />
<div id="nombre"></div>
<input type="button" value="premier, troisième et cinqième élément du tableau" onclick="element()" />
<div id="element"></div>
<input type="button" value="tableau triè par ordre alphabétique" onclick="alpha()" />
<div id="alpha"></div>
<input type="button" value="nouvelle entrée dans le tableau" onclick="nouveau()" />
<div id="nouveau"></div>
<input type="button" value="afficher le tableau" onclick="affi()" />
<div id="affi"></div>

JavaScript

var tableau =["REYT seb","KERAVEC steph","ESNEE caro","SIMON bastien","CARON nico"];

function afficher(){
    var x = tableau.join(" - ");
    return x;
}
function nombre(){
    var longueur = tableau .length;
    document.getElementById("nombre").innerHTML = longueur + " entrées dans ce tableau";
}

function element(){
    document.getElementById("element").innerHTML = "premier : " + tableau[0] + " - troisième : " + tableau[2] + " - cinquième : " + tableau[4];
}

function alpha(){
    var tableau_1 = tableau.sort();
    document.getElementById("alpha").innerHTML = tableau_1.join(" - ");    
}

function nouveau(){
    var x = prompt("entre le nouveau collègue ");
    if (/^[a-zA-Z ]+$/.test(x) ){
        tableau.push(x);
        document.getElementById("nouveau").innerHTML = afficher();
    }  
}

function affi(){
    document.getElementById("affi").innerHTML = afficher();
}