Affichage avec les templates literal

Version imprimable

Bonjour, j'étudie le le livre Tout Javascript de Olivier Hondermarck et je n'arrive pas à faire fonctionner le code suivant , concernant les templates literal:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 <!DOCTYPE html> <html> <head> <title>Usage de template literal ou gabarit de texte</title> </head> <h1>Usage de template literal ou gabarit de texte</h1> <script type="text/javascript"> var prenom="Olivier"; var text = "Bonjour " + prenom + " !"; console.log(text); var text = `Bonjour ${prenom} !`; console.log(text); console.log(`5 + 5 * 2 = ${5+5*2}`); // 5 + 5 * 2 = 15 var nb=12; console.log(`Le panier contient ${nb} article${nb>1? "s" : ""}`); /* Le panier contient 12 articles */ console.log(`PI vaut ${Math.PI}`); // PI vaut 3.141592653589793 </script> </html>
Je l'ai mis dans un fichier.html et je n'ai que <head et <h1 qui s'affiche. Qu'en pensez-vous. Le livre nous dit que la syntaxe n'est pas supporter par inernet explorer. Merci

27/01/2021, 07h33
javatwister

Une balise body serait utile pour visualiser le corps du document;

Mais c'est vrai que la syntaxe littérale sera sans doute mal reçue par IE;

suite

Bonjour, merci de votre réponse. Avec la balise body comme suit je n'ai rien non plus :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!DOCTYPE html>
<html>
  <head>
    <title>Usage de template literal ou gabarit de texte</title>
  </head>
  <body>
  <h1>Usage de template literal ou gabarit de texte</h1>
  <script type="text/javascript">
  var prenom="Olivier";
  var text = "Bonjour " + prenom + " !";
  console.log(text);
  var text = `Bonjour ${prenom} !`;
  console.log(text);
 
  console.log(`5 + 5 * 2 = ${5+5*2}`);   // 5 + 5 * 2 = 15
  var nb=12;
  console.log(`Le panier contient ${nb} article${nb>1? "s" : ""}`);
    /* Le panier contient 12 articles */
  console.log(`PI vaut ${Math.PI}`); // PI vaut 3.141592653589793
  </script>
</body>
</html>

La balise <html> doit englober le <body> mais pas le <head>.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!DOCTYPE html>
  <head>
    <title>Usage de template literal ou gabarit de texte</title>
  </head>
 <html>
 <body>
  <h1>Usage de template literal ou gabarit de texte</h1>
  <script type="text/javascript">
  var prenom="Olivier";
  var text = "Bonjour " + prenom + " !";
  console.log(text);
  var text = `Bonjour ${prenom} !`;
  console.log(text);
 
  console.log(`5 + 5 * 2 = ${5+5*2}`);   // 5 + 5 * 2 = 15
  var nb=12;
  console.log(`Le panier contient ${nb} article${nb>1? "s" : ""}`);
    /* Le panier contient 12 articles */
  console.log(`PI vaut ${Math.PI}`); // PI vaut 3.141592653589793
  </script>
 </body>
</html>

UPDATE : Oublie ce que j'ai dit c'est une grosse bêtise.

27/01/2021, 17h14
javatwister

Bah, tu as au moins le titre qui s'affiche en gras...

Le reste s'affiche dans la console de développement: appuie sur la touche F12 ou sur Ctrl + Maj + i
27/01/2021, 18h23
Diegomarck

Merci