06/06/2026 11:53 Annexe JS 2025 - Résumé complet avec exemples

📜 Annexe JavaScript 2025

Résumé complet avec exemples interactifs | Bac STI

🔢 Opérateurs

&& (ET) || (OU) ! (NON)

Permettent de combiner des conditions logiques.

let age = 25;

let a = true, b = false;

[Link](age > 18 && age <

60); // true (les deux conditions sont vraies)
[Link](a || b); // true (au moins une
vraie)
[Link](!a); // false (inverse)

🔍 Tester

Tester les opérateurs logiques

(age > 18 && age < 60) = true

(true || false) = true
(!true) = false

== != > >= < <=

Comparer deux valeurs.

let x = 10, y = 20;

[Link](x == y); // false (égal)

[Link](x != y); // true (différent)

localhost/2025-2026/STI/[Link] 1/8
06/06/2026 11:53 Annexe JS 2025 - Résumé complet avec exemples

[Link](x > y); // false (supérieur)

[Link](x < y); // true (inférieur)

🔍 Tester

10 20 Comparer

10 == 20 : false
10 != 20 : true
10 > 20 : false
10 < 20 : true

+ - * / %

Addition, soustraction, multiplication, division, reste.

let a = 15, b = 4;

[Link](a + b); // 19 (addition)

[Link](a - b); // 11 (soustraction)
[Link](a * b); // 60 (multiplication)
[Link](a / b); // 3.75 (division)
[Link](a % b); // 3 (reste de la division)

🔍 Tester

15 4 Calculer

15 + 4 = 19
15 - 4 = 11
15 × 4 = 60
15 ÷ 4 = 3.75
15 % 4 = 3

💬 Affichage et saisie

alert() / [Link]() / prompt()

localhost/2025-2026/STI/[Link] 2/8
06/06/2026 11:53 Annexe JS 2025 - Résumé complet avec exemples

// Afficher un message
alert("Bienvenue !");

// Écrire dans la page

[Link]("<p>Texte écrit par
JS</p>");

// Saisir une valeur

let nom = prompt("Quel est
votre nom ?");

🔍 Tester

alert() prompt()

Bonjour Slim !

🔄 Fonctions de conversion

isNaN() / Number() / parseFloat() / parseInt() /

String()

let ch = "123.45";

isNaN(ch); // false (est un nombre)

Number(ch); // 123.45
parseFloat(ch); // 123.45
parseInt(ch); // 123
String(123); // "123"

🔍 Tester

123.45 Convertir

Valeur : "123.45"
isNaN() : false
Number() : 123.45
parseFloat() : 123.45

localhost/2025-2026/STI/[Link] 3/8
06/06/2026 11:53 Annexe JS 2025 - Résumé complet avec exemples
parseInt() : 123
String() : "123.45"

🎯 Sélection d'éléments HTML

getElementById() / getElementsByName()

// Sélection par ID (élément unique)

let elem = [Link]("monId");

// Sélection par NAME (collection)

let elements = [Link]("monNom");

🔍 Démonstration
Texte modifié par getElementById() !

getElementById()

✅ getElementById() a modifié le texte ci-dessus

📐 Objet Math

[Link]() / sqrt() / round() / trunc() / random()

[Link](-5);
// 5 (valeur absolue)
[Link](16);
// 4 (racine carrée)
[Link](3.6);
// 4 (arrondi)
[Link](3.9);
// 3 (troncature)
[Link](); // [Link]
(aléatoire entre 0 et 1)

localhost/2025-2026/STI/[Link] 4/8
06/06/2026 11:53 Annexe JS 2025 - Résumé complet avec exemples

🔍 Tester

Exemples Math 🎲 Lancer un dé

[Link](-5) = 5
[Link](16) = 4
[Link](3.6) = 4
[Link](3.9) = 3
[Link]() = 0.09059324640008626

📝 Chaînes de caractères

Propriétés et méthodes des chaînes

let str = " Bonjour le Monde ";

[Link]; // longueur
[Link]("le"); //
position de "le"
[Link]("o"); //
dernière position de "o"
[Link](2, 9);
// sous-chaîne
[Link]("Monde", "Univers"); // remplacement
[Link](); // minuscules
[Link](); // majuscules
[Link](); // supprime les espaces
[Link](72,101,108,108,111); // "Hello"

🔍 Tester

Bonjour le Monde Analyser

Chaîne : " Bonjour le Monde "

length : 20
indexOf("le") : 10
lastIndexOf("o") : 14
substring(2,9) : "Bonjour"
trim() : "Bonjour le Monde"
toUpperCase() : " BONJOUR LE MONDE "
replace("Monde","Univers") : " Bonjour le Univers "

replace() substring() toUpperCase() fromCharCode()

localhost/2025-2026/STI/[Link] 5/8
06/06/2026 11:53 Annexe JS 2025 - Résumé complet avec exemples

[Link](72,101,108,108,111) : "Hello"
[Link](74,83) : "JS"

📅 Objet Date

new Date() / getDate() / getMonth() / getFullYear() /

toString()

let d = new Date();

// date courante
[Link](); // jour du mois (1-31)
[Link](); // mois (0-11)
[Link](); // année (4 chiffres)
[Link](); // chaîne représentant la date

🔍 Tester

Date actuelle Heure actuelle Date spécifique

Date spécifique : Thu May 29 2025 01:00:00 GMT+0100 (heure d’été britannique)
getFullYear() : 2025
getMonth() : 5
getDate() : 29

🎨 Manipulation du DOM

Modifier attributs, styles et méthodes

// Modifier un attribut
[Link] = "nouvelle valeur";
[Link] = true;
[Link] = true;
[Link] = "[Link]";

// Modifier un style
[Link] = "red";

localhost/2025-2026/STI/[Link] 6/8
06/06/2026 11:53 Annexe JS 2025 - Résumé complet avec exemples

[Link] = "200px";

// Méthodes spécifiques
[Link]();
[Link]();

🔍 Tester

Boîte

Changer couleur Agrandir Réinitialiser

🎯 Sélecteur <select>

Propriété selectedIndex

Récupérer l'indice de l'option sélectionnée dans une liste déroulante.

let select = [Link]("monSelect");

let index = [Link];
let valeur = [Link][index].value;
let texte = [Link][index].text;

🔍 Tester

Tunisie Afficher selectedIndex

selectedIndex : 0
Texte : Tunisie
Valeur : tn

localhost/2025-2026/STI/[Link] 7/8
06/06/2026 11:53 Annexe JS 2025 - Résumé complet avec exemples

📑 Tableau récapitulatif

Catégorie Fonctions/Méthodes/Propriétés

Opérateurs logiques && (ET) || (OU) ! (NON)

Opérateurs comparaison == != > >= < <=

Opérateurs arithmétiques +-*/%

Affichage alert() [Link]()

Saisie prompt()

Conversion isNaN() Number() parseFloat() parseInt() String()

Sélection getElementById() getElementsByName()

Math abs() sqrt() round() trunc() random()

Chaînes length

indexOf() lastIndexOf()

substring() replace()

toLowerCase() toUpperCase() trim() fromCharCode()

Date new Date() getDate() getMonth() getFullYear() toString()

Manipulation DOM value, checked, disabled, readonly, src, muted

[Link], [Link], [Link]
play(), pause()

Sélecteur selectedIndex

📚 Annexe JavaScript 2025 - Lycée Cité Des Journalistes - Ariana

Conforme au programme officiel STI

localhost/2025-2026/STI/[Link] 8/8