From d596e86a4f13b04981f51d327af257b07e6d21c3 Mon Sep 17 00:00:00 2001 From: SphinxKnight Date: Sun, 14 Nov 2021 14:23:22 +0100 Subject: Prepare Learning Area section for Markdown conversion (#2738) * Remove summary, spans and fonts * Remove notranslate class * Remove ids other than headings * Remove hidden blocks * fix livesample call with exclamation mark * fix livesample call with exclamation mark * fix livesample call with exclamation mark * fix livesample call with exclamation mark * Fix notes * Remove code in pre, sub/sup and some styles * fix dls * fix absolute / english links * fix figures and others * fix other issues from report * Fix other one-off issues excl. imgs * Fix images * Fixes #2842 for Learning area --- .../javascript/first_steps/what_is_javascript/index.html | 15 ++++++--------- 1 file changed, 6 insertions(+), 9 deletions(-) (limited to 'files/fr/learn/javascript/first_steps/what_is_javascript') diff --git a/files/fr/learn/javascript/first_steps/what_is_javascript/index.html b/files/fr/learn/javascript/first_steps/what_is_javascript/index.html index a3bac2d0fb..5e37499c73 100644 --- a/files/fr/learn/javascript/first_steps/what_is_javascript/index.html +++ b/files/fr/learn/javascript/first_steps/what_is_javascript/index.html @@ -246,7 +246,6 @@ function updateName() {

Notez que parfois vous tomberez sur des morceaux de JavaScript directement dans le HTML. Ce qui peut ressembler à ça :

-
function createParagraph() {
   let para = document.createElement('p');
   para.textContent = 'Vous avez cliqué !';
@@ -254,16 +253,17 @@ function updateName() {
 }
<button onclick="createParagraph()">Cliquez-moi!</button>
-

Vous pouvez essayer cette version dans la démonstration ci-dessous.

-

{{ EmbedLiveSample('inline_js_example', '100%', 150) }}

+

{{ EmbedLiveSample('Handlers_JavaScript_en_ligne', '100%', 150) }}

Cet exemple a exactement le même comportement que ceux des deux sections précédentes, sauf que l'élément {{htmlelement("button")}} a un handler onclick en ligne pour déclencher l'exécution de la fonction à la pression du bouton.

Évitez cependant de faire cela. C'est une mauvaise habitude de polluer le HTML avec du JavaScript, en plus d'être inefficace. Dans cette méthode, on doit inclure l'attribut onclick="createParagraph()" sur chaque bouton où le JavaScript doit s'appliquer.

+

En JavaScript pur

+

Une construction en JavaScript pur permet de sélectionner tous les boutons avec une instruction. Dans l'exemple précédent c'est cette partie qui s'en charge :

let buttons = document.querySelectorAll('button');
@@ -311,13 +311,10 @@ document.addEventListener("DOMContentLoaded", function() {
 
 

Les scripts asynchrones téléchargeront le script sans bloquer le rendu de la page et l'exécuteront dès que le téléchargement du script sera terminé. Vous n'obtenez aucune garantie que les scripts s'exécutent dans un ordre spécifique, mais seulement qu'ils n'empêcheront pas le reste de la page de s'afficher. Il est préférable d'utiliser async lorsque les scripts de la page s'exécutent indépendamment les uns des autres et ne dépendent d'aucun autre script de la page.

-
- async vs defer -
Image de la spécification HTML, copiée et rognée selon les termes de la licence CC BY 4.0. -
-
+async vs defer -
+

Image de la spécification HTML, copiée et rognée selon les termes de la licence CC BY 4.0. +

Par exemple, si vous avez les éléments de script suivants :

-- cgit v1.2.3-54-g00ecf