Javascript #2.2 : jQuery

Moteurs JavaScript pour le développement
Navigateur JSFiddleConsole

Les outils du développeur Javascript (1)
FireFox Chrome Chrome Canary

Les outils du développeur Javascript (2)
Sublime Text BracketsAtom.io

Un fichier javascript
alert("Bazinga");
alert("Im not crazy.");
alert("My mother had me tested");

Quelques commandes
alert("Suit up!");
console.log("Haaaaaave you met Ted?");

Commentaires
// Single Line Comments
/*
Multi-line
Comments
*/

1.3 Où mettre du javascript ?

JavaScript dans une page HTML (1)
<!doctype html>
<html>
<head></head>
<body>
    <script>
       alert('Hello world!');
     </script>
</body>
</html>

JavaScript dans une page HTML (2)
<!doctype html>
<html>
<head></head>
<body>
<script src="hello.js"></script>
</body>
</html>

jQuery ?
jQuery is a cross-platform JavaScript library designed
to simplify the client-side scripting of HTML. jQuery is
the most popular JavaScript library in use today.
jQuery is free, open-source software licensed under
the MIT License.
https://en.wikipedia.org

Use jQuery
<!DOCTYPE html>
<html lang="fr">
<head></head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>

Document ready
$(document).ready(function() {
alert('Hello');
}

Example : Smooth scroll
$('a[href^="#"]').click(function(){
var the_id = $(this).attr("href");
$('html, body').animate({
scrollTop:$(the_id).offset().top
}, 'slow');
return false;
});

Javascript #2.2 : jQuery

Recommandé

Recommandé

Contenu connexe

Tendances

Tendances (20)

En vedette

En vedette (20)

Similaire à Javascript #2.2 : jQuery

Similaire à Javascript #2.2 : jQuery (20)

Plus de Jean Michel

Plus de Jean Michel (19)

Dernier

Dernier (20)

Javascript #2.2 : jQuery