[Script Info]
Title: 
[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:00.77,0:00:02.61,Default,,0000,0000,0000,,Je vais maintenant vous initier
Dialogue: 0,0:00:02.61,0:00:05.72,Default,,0000,0000,0000,,à l'utilisation de jQuery dans votre page Web.
Dialogue: 0,0:00:05.72,0:00:09.00,Default,,0000,0000,0000,,La 1ère étape consiste à inclure\Nla bibliothèque jQuery
Dialogue: 0,0:00:09.00,0:00:11.54,Default,,0000,0000,0000,,en utilisant une balise <script>.
Dialogue: 0,0:00:12.23,0:00:16.12,Default,,0000,0000,0000,,Avant, on plaçait le JavaScript à l'intérieur\Nd'une balise ,
Dialogue: 0,0:00:16.12,0:00:20.28,Default,,0000,0000,0000,,mais cette fois, je vais ajouter un attribut 'src'.
Dialogue: 0,0:00:20.28,0:00:24.39,Default,,0000,0000,0000,,Et il me faut le définir avec une URL.
Dialogue: 0,0:00:24.39,0:00:26.57,Default,,0000,0000,0000,,Quelle doit être cette URL ?
Dialogue: 0,0:00:26.57,0:00:28.63,Default,,0000,0000,0000,,Si je travaillais sur mon propre ordinateur
Dialogue: 0,0:00:28.63,0:00:30.09,Default,,0000,0000,0000,,et que j'avais téléchargé jQuery
Dialogue: 0,0:00:30.09,0:00:32.52,Default,,0000,0000,0000,,dans le même répertoire que ma page Web,
Dialogue: 0,0:00:32.52,0:00:36.47,Default,,0000,0000,0000,,je pourrais juste écrire 'jquery.js' ici.
Dialogue: 0,0:00:36.47,0:00:39.41,Default,,0000,0000,0000,,Mais ça ne marchera pas, ici, à la Khan Academy.
Dialogue: 0,0:00:39.41,0:00:43.10,Default,,0000,0000,0000,,Ici, il faut une URL absolue de jQuery
Dialogue: 0,0:00:43.10,0:00:45.88,Default,,0000,0000,0000,,pointant sur un serveur en ligne quelque part.
Dialogue: 0,0:00:45.88,0:00:50.08,Default,,0000,0000,0000,,Il y a une liste de ces URL sur jquery.com,
Dialogue: 0,0:00:50.62,0:00:52.74,Default,,0000,0000,0000,,et j'ai l'une d'entre elles ici, que je vais coller.
Dialogue: 0,0:00:52.74,0:00:54.43,Default,,0000,0000,0000,,Et voilà !
Dialogue: 0,0:00:54.43,0:00:56.12,Default,,0000,0000,0000,,Bien. Maintenant, je vais discuter de quelques détails
Dialogue: 0,0:00:56.12,0:00:58.03,Default,,0000,0000,0000,,à propos de cette URL.
Dialogue: 0,0:00:58.03,0:01:01.82,Default,,0000,0000,0000,,Premièrement, elle commence avec 'https'.
Dialogue: 0,0:01:01.82,0:01:05.23,Default,,0000,0000,0000,,Ça signifie que c'est une URL sécurisée.
Dialogue: 0,0:01:05.23,0:01:09.23,Default,,0000,0000,0000,,Nous ne vous permettons que l'inclusion\Nde ressources sécurisées
Dialogue: 0,0:01:09.23,0:01:11.21,Default,,0000,0000,0000,,dans les pages Web de la Khan Academy
Dialogue: 0,0:01:11.21,0:01:15.34,Default,,0000,0000,0000,,et c'est généralement recommandé\Ndans le développement Web.
Dialogue: 0,0:01:15.66,0:01:18.86,Default,,0000,0000,0000,,OK. Deuxièmement, elle est située
Dialogue: 0,0:01:18.86,0:01:22.75,Default,,0000,0000,0000,,sur un serveur Google : googleapis.com
Dialogue: 0,0:01:22.75,0:01:25.38,Default,,0000,0000,0000,,Ce serveur est appelé un CDN,
Dialogue: 0,0:01:25.38,0:01:27.92,Default,,0000,0000,0000,,un réseau de diffusion de contenu\N(Content Delivery Network),
Dialogue: 0,0:01:27.92,0:01:29.41,Default,,0000,0000,0000,,ce qui veut dire que c'est optimisé
Dialogue: 0,0:01:29.41,0:01:32.62,Default,,0000,0000,0000,,pour servir des fichiers statiques,\Ncomme des bibliothèques JavaScript,
Dialogue: 0,0:01:32.62,0:01:35.39,Default,,0000,0000,0000,,et ce, très rapidement.
Dialogue: 0,0:01:35.39,0:01:38.16,Default,,0000,0000,0000,,Ce serveur Google fait partie de ceux dans\Nlesquels j'ai confiance,
Dialogue: 0,0:01:38.16,0:01:41.30,Default,,0000,0000,0000,,et généralement, vous devez toujours\Nfaire confiance dans les serveurs
Dialogue: 0,0:01:41.30,0:01:43.00,Default,,0000,0000,0000,,par lesquels vous récupérez des scripts
Dialogue: 0,0:01:43.00,0:01:47.24,Default,,0000,0000,0000,,vu qu'ils pourraient potentiellement\Nagir de façon malveillante sur votre page.
Dialogue: 0,0:01:47.40,0:01:50.01,Default,,0000,0000,0000,,OK. Troisièmement, il y a un numéro de version
Dialogue: 0,0:01:50.01,0:01:53.81,Default,,0000,0000,0000,,dans cette URL : 2.1.4.
Dialogue: 0,0:01:53.81,0:01:56.40,Default,,0000,0000,0000,,La bibliothèque jQuery est en développement actif
Dialogue: 0,0:01:56.40,0:01:59.02,Default,,0000,0000,0000,,et ils sortent régulièrement de nouvelles versions.
Dialogue: 0,0:01:59.02,0:02:00.99,Default,,0000,0000,0000,,Les nombres les plus à gauche
Dialogue: 0,0:02:00.99,0:02:03.28,Default,,0000,0000,0000,,représentent les modifications majeures de version
Dialogue: 0,0:02:03.28,0:02:05.76,Default,,0000,0000,0000,,alors que les nombres les plus à droite
Dialogue: 0,0:02:05.76,0:02:08.13,Default,,0000,0000,0000,,représentent les versions mineures.
Dialogue: 0,0:02:08.13,0:02:10.35,Default,,0000,0000,0000,,J'utiliser jQuery 2 ici,
Dialogue: 0,0:02:10.35,0:02:12.30,Default,,0000,0000,0000,,qui fonctionne sur les navigateurs modernes
Dialogue: 0,0:02:12.30,0:02:14.48,Default,,0000,0000,0000,,mais pas sur IE8.
Dialogue: 0,0:02:14.48,0:02:15.64,Default,,0000,0000,0000,,Sur votre propre site,
Dialogue: 0,0:02:15.64,0:02:19.63,Default,,0000,0000,0000,,vous pouvez décider quelle version utiliser\Nen vous basant sur vos besoins.
Dialogue: 0,0:02:19.63,0:02:22.81,Default,,0000,0000,0000,,Bien. Donc, jQuery est incluse.
Dialogue: 0,0:02:22.81,0:02:24.97,Default,,0000,0000,0000,,Maintenant, utilisons-la
Dialogue: 0,0:02:24.97,0:02:28.27,Default,,0000,0000,0000,,dans une autre balise <script>.
Dialogue: 0,0:02:30.23,0:02:33.31,Default,,0000,0000,0000,,Toutes les bibliothèques JavaScript fournissent\Ndes fonctions
Dialogue: 0,0:02:33.31,0:02:35.36,Default,,0000,0000,0000,,et elles donnent les noms de ces fonctions.
Dialogue: 0,0:02:35.36,0:02:37.01,Default,,0000,0000,0000,,On doit regarder dans la documentation
Dialogue: 0,0:02:37.01,0:02:39.26,Default,,0000,0000,0000,,pour découvrir les noms de ces fonctions
Dialogue: 0,0:02:39.26,0:02:41.76,Default,,0000,0000,0000,,et ce qu'elles font réellement.
Dialogue: 0,0:02:41.76,0:02:45.44,Default,,0000,0000,0000,,Bien, la bibliothèque jQuery\Nfournit une fonction principale
Dialogue: 0,0:02:45.44,0:02:47.52,Default,,0000,0000,0000,,qui possède un nom très court.
Dialogue: 0,0:02:47.52,0:02:50.64,Default,,0000,0000,0000,,C'est juste le signe '$'.
Dialogue: 0,0:02:50.64,0:02:52.26,Default,,0000,0000,0000,,Ça signifie que la 1ère chose que j'écris
Dialogue: 0,0:02:52.26,0:02:53.56,Default,,0000,0000,0000,,est '$',
Dialogue: 0,0:02:53.56,0:02:56.53,Default,,0000,0000,0000,,puis 2 parenthèses, car c'est une fonction,
Dialogue: 0,0:02:56.53,0:02:59.41,Default,,0000,0000,0000,,et bien sûr, un point-virgule.
Dialogue: 0,0:02:59.41,0:03:01.93,Default,,0000,0000,0000,,C'est vraiment bien que le nom de cette fonction\Nsoit si court
Dialogue: 0,0:03:01.93,0:03:05.76,Default,,0000,0000,0000,,car on appellera cette fonction sacrément souvent.
Dialogue: 0,0:03:06.23,0:03:08.93,Default,,0000,0000,0000,,Il y a plein de choses qu'on peut passer à cette fonction,
Dialogue: 0,0:03:08.93,0:03:10.30,Default,,0000,0000,0000,,mais pour cette exemple introductif,
Dialogue: 0,0:03:10.30,0:03:15.25,Default,,0000,0000,0000,,je vais juste passer une chaîne de caractères "h1".
Dialogue: 0,0:03:16.32,0:03:17.70,Default,,0000,0000,0000,,Quand je fais ça,
Dialogue: 0,0:03:17.70,0:03:19.72,Default,,0000,0000,0000,,ça demande à jQuery de trouver
Dialogue: 0,0:03:19.72,0:03:23.10,Default,,0000,0000,0000,,tous les éléments <h1> sur la page
Dialogue: 0,0:03:23.10,0:03:28.05,Default,,0000,0000,0000,,pour les retourner sous forme\Nd'objet collection jQuery.
Dialogue: 0,0:03:28.15,0:03:29.31,Default,,0000,0000,0000,,Maintenant que j'ai fait ça,
Dialogue: 0,0:03:29.31,0:03:33.23,Default,,0000,0000,0000,,je peux appeler d'autres méthodes sur l'objet jQuery
Dialogue: 0,0:03:33.23,0:03:37.20,Default,,0000,0000,0000,,dans le but de manipuler les élements <h1>\Nqui ont été trouvés.
Dialogue: 0,0:03:37.20,0:03:39.94,Default,,0000,0000,0000,,Si je souhaite modifier leur texte interne à toutes,
Dialogue: 0,0:03:39.94,0:03:43.36,Default,,0000,0000,0000,,je peux appeler la fonction 'text'
Dialogue: 0,0:03:43.36,0:03:46.04,Default,,0000,0000,0000,,et lui passer une chaîne de caractères.
Dialogue: 0,0:03:47.24,0:03:48.49,Default,,0000,0000,0000,,Ça passe !
Dialogue: 0,0:03:48.49,0:03:49.79,Default,,0000,0000,0000,,Oui !
Dialogue: 0,0:03:49.79,0:03:50.80,Default,,0000,0000,0000,,Et on a fini !
Dialogue: 0,0:03:50.80,0:03:53.03,Default,,0000,0000,0000,,C'est notre premier morceau de jQuery.
Dialogue: 0,0:03:53.03,0:03:56.91,Default,,0000,0000,0000,,On a donc inclus la bibliothèque jQuery\Navec la balise ,
Dialogue: 0,0:03:56.91,0:03:59.82,Default,,0000,0000,0000,,dit à jQuery de chercher toutes les <h1>\Nsur la page,
Dialogue: 0,0:03:59.82,0:04:03.64,Default,,0000,0000,0000,,puis demandé à jQuery de modifier, à toutes, leur texte.
Dialogue: 0,0:04:03.64,0:04:06.33,Default,,0000,0000,0000,,Si vous continuez, on en verra plus,
Dialogue: 0,0:04:06.33,0:04:07.65,Default,,0000,0000,0000,,plus en détail,
Dialogue: 0,0:04:07.65,0:04:11.12,Default,,0000,0000,0000,,avec plus de techniques pour sélectionner\Net manipuler les éléments,
Dialogue: 0,0:04:11.12,0:04:14.35,Default,,0000,0000,0000,,en utilisant jQuery pour répondre à des événements\Nutilisateur sur la page,
Dialogue: 0,0:04:14.35,0:04:18.56,Default,,0000,0000,0000,,plus des trucs cools avec les animations et les effets.