(8 métodos de jQuery que deberías conocer) + 4 que quizá ya conocías

jQuery la librería de javascript mas usada. Tiene una multitud de métodos, efectos, animaciones... Me he topado con este post 8-jquery-methods-you-need-to-know en el que explica de forma breve 8 métodos interesantes que se debería conocer si vas a usar esta librería. Yo he incluido algunos mas que me parecen interesantes.

.data() info
Este no lo conocía y me ha parecido muy interesante. Os mostrare un ejemplo:

<div data-type="page" data-hidden="true" data-options='{"name":"John"}'></div>

$("div").data("role") === "page";
$("div").data("hidden") === true;
$("div").data("options").name === "John";

Otra forma de hacer lo mismo

$("div").data("role", "page");
$("div").data("hidden", "true");
$("div").data("role", {name: "John"});

De está forma nos permite almacenar información sobre los elementos de la página.

.stop() info

Con esto podemos llamar a un elemento que se está ejecutando una animación y pararlo. Pudiendo concatenar otra acción cuando este termine, como por ejemplo .fadeOut() vemos un ejemplo de ello:

$(this).find('img').stop(true, true).fadeOut();

.toggleClass() info

Añade o elimina la clase/s en el elemento con el que interactua (es pulsado). Un ejemplo:

$('#opcion').toggleClass('active');

podemos hacer lo mismo realizando este proceso:

if ($('#home').hasClass('active')) {
    $('#home').removeClass('active');
}
else {
    $('#home').addClass('active');
}

.delay(duración, [nombreCola]) info

Sirve para crear un intervalo de espera entre la ejecución de funciones.

$('#content').slideUp(300).delay(800).fadeIn(400);

.each() info

Recorre un objeto ejecutando la función en todos los elementos coincidentes.

Lista: <span>(pulsa para cambiar)</span>
    <ul>
        <li>Platanos</li>
        <li>Manzanas</li>

        <li>Naranjas</li>
    </ul>
    <script>
        $("span").click(function () {

            $("li").each(function(){
                $(this).toggleClass("example");
            });
        });
    </script>

.size() info
devuelve el numero de elementos del objeto.

var size1 = $("li").size();
var size2 = $("li").length;

.length hace el mismo efecto.

.closest() info

Obtiene un grupo de elementos que contenga el elemento padre más cercano que cumpla con el selector especificado, incluyendo al elemento inicial. Comienza comprobando primero si el elemento actual cumple con la selección especificada. Si es así devuelve ese elemento. En caso contrario continúa buscando en el elemento, padre a padre, hasta que encuentra un elemento que cumpla la condición dada. Si no lo encuentra, no devuelve nada.

$('p').find('span')

.position() info
Como su nombre indica obtiene las coordenadas del elemento.

    var p = $("p:first");
    var position = p.position();
    $("p:last").text( "left: " + position.left + ", top: " + position.top );

.noConflict() info
Con esto podemos editar la referencia del " $ "

var j = jQuery.noConflict();
// Ahora, en vez de $, usamos j.
j('#someDiv').hide();
// La siguiente linea referenciará a otra librería con la función $
$('someDiv').style.display = 'none';

.ready() info
Ejecuta la función cuando está listo el elemento indicado.

$(document).ready(function() {
    // ejecuta la función cuando el documento está cargado
});

otra versión mas optimizada.

$(function() {
    // ejecuta la función cuando el documento está cargado
});

.load() info

El evento load se lanza tan pronto el elemento al que hemos asociado el evento ha terminado de cargarse por completo. Este evento puede asociarse a cualquier tipo de elemento que tenga una URL, imágenes, iframes, hojas de estilo o javascripts...

Hay que tener especial cuidado con las imágenes, porque si la imagen la carga desde la caché en ocasiones 

no lanza el evento de cargado. Un ejemplo de este evento podría ser;

<img alt="Book" id="book" src="book.png" />

$('#book').load(function() {

    // Hace algo cuando termina de cargar la imagen por completo

});

.one() info

Es igual que bind, pero en este caso el evento sólo se ejecuta una vez. Por ejemplo, puede interesarnos que cuando pinchemos un botón se muestre un mensaje, pero que la segunda vez que se pinche ya no se muestre, en ese caso podríamos hacer,

$('#boton').one('click', function() {
    alert('Este mensaje se muestra sólo una vez');
});