Script jQuery

Exemples simples de scripts jQuery

jQuery propose donc tout un tas de fonctions plus utiles les unes que les autres. Contrairement à Javascript "de base", jQuery encapsule tous les nœuds DOM dans des objets étendus. C'est a dire que chaque objet dispose de méthodes additionnelles spécifiques à jQuery directement utilisables.

Je ne ferai ici qu'un tour d'horizon de la base, voici quelques exemples simples de scripts jQuery:

Récupérer un élément par son ID via jQuery / Javascript

// Natif
var div = document.getElementById('myDiv');

// jQuery
var div = $('#myDiv');

Récupérer les <p> contenus dans un <div id="myDiv">

// Natif
var div = document.getElementById('myDiv');
var p_list = div.getElementsByTagName('p');

// jQuery
var p_list = $('#myDiv p');

Supprimer les <p> contenus dans un <div id="myDiv">

// Natif
var div = document.getElementById('myDiv');
var p_list = div.getElementsByTagName('p');

for (var i=0 ; i < p_list.length ; i++)
{
div.removeChild(p_list[i]);
}

// jQuery
$('#myDiv p').remove();

Cacher/afficher un élément par un clic sur un bouton

// Natif
var button = document.getElementById('button');

button.onclick = function()
{
var div = document.getElementById('myDiv');
var display = div.style.display != 'block' ? 'block' : 'none';
div.style.display = display;
};

// jQuery
$('#button').click(function()
{
$('#myDiv').toggle();
});

Je vous renvoie au au site de jQuery pour plus d'informations à son sujet.