Task 1.
Créez deux variables y1 = 6, y2 = 3. Créez un div (choisissez la classe vous-même), affichez-y la somme de y1 et y2.
Task 2.
Créez un div avec le texte 'Hello' et la classe .out-2. À l'aide de innerHTML, ajoutez-y le texte "Master". Vous devez obtenir : Hello Master. (Utilisez la notation abrégée)
Task 3.
Créez un input et un bouton. Au clic sur le bouton, une fonction s'exécute et affiche sur la page le nombre saisi par l'utilisateur multiplié par 10.
Task 4.
Créez un input, un bouton et un div vide avec la classe .out-4. Au clic sur le bouton, une fonction s'exécute et affiche sur la page, dans le div, une nouvelle balise <h1> avec le texte saisi par l'utilisateur (<h1>Text Input</h1>). Pour cela, utilisez la concaténation de chaînes ('<h1>' + ...).
Task 5.
Créez deux input avec type="number", dans lesquels l'utilisateur peut saisir des nombres. Au clic sur le bouton, une fonction doit s'exécuter et afficher sur la page la somme des nombres saisis.
Task 6.
Créez un input, un bouton et un div vide avec la classe .out-6. L'utilisateur saisit un texte dans l'input. Au clic sur le bouton, une fonction s'exécute et ajoute dans le div une nouvelle balise <p> avec le texte saisi (<p>Text Input</p>). Utilisez la concaténation de chaînes ('<p>' + ...) et la notation abrégée. Important : le texte doit vraiment s'ajouter. Si vous cliquez plusieurs fois, un nouveau texte doit s'ajouter à chaque fois.
Task 7.
Créez un input et un bouton. Au clic sur le bouton, une fonction s'exécute et affiche sur la page, dans un div, le nombre saisi par l'utilisateur additionné du nombre 10.
Indice : faites attention au type de données
Task 8.
Créez un input, un bouton et une liste vide <ul> avec la classe .out-8. L'utilisateur saisit un texte dans l'input. Au clic sur le bouton, une fonction s'exécute, crée une nouvelle balise <li> avec le texte saisi et l'ajoute à la liste. Utilisez la concaténation de chaînes ('<li>' + ...) et la notation abrégée. Important : chaque nouveau clic ajoute un nouvel élément à la liste.
Task 9.
Créez un input avec type="number" et un bouton avec le texte 1. Au clic sur le bouton, une fonction s'exécute et ajoute au texte du bouton le chiffre saisi par l'utilisateur. Si vous cliquez plusieurs fois sur le bouton, un nouveau chiffre doit s'ajouter à chaque fois à la valeur déjà modifiée.
Indice : faites attention au type de données
Task 10.
Récupérez à l'aide de querySelector la balise body ( querySelector('body') ). À l'aide de innerHTML, assignez-lui une chaîne vide (...innerHTML = ''). Observez ce qui se passe.