Programar en javascript puede ser más fácil sabiendo utilizar jQuery
Y ahora tambien aprende a programar en C++ con Aprende Web C++
y entérate de las novedades o deja un comentario.
última modificación: 13-07-2018.
Visitas este mes: 18
Visitas el mes pasado: 42
Mi agradecimiento a las siguientes páginas Web. en las cuales me he basado para la elaboración de este manual:
Si este sitio te parece interesante puedes contribuir con una pequeña aportación.
El método .data() sirve tanto para guardar datos como para consultarlos. Cada dato consta de dos elementos , el nombre y el valor, por ejemplo, "contacto" y "teléfono".
La sintaxis de este método es sencilla:
$("#elemento").data("Alberto","675-32-44-75");
En este caso hemos guardado un dato cuyo nombre es un contacto (Alberto), y el valor es el teléfono. Para consultar este dato escribiremos el siguiente código:
tfno=$("#elemento").data("Alberto");
En la variable tfno obtendremos el valor del dato cuyo nombre hemos pasado. (en este caso el teléfono)
Para eliminar un dato utilizaremos el método removeData(). Debemos pasar como argumento el nombre del dato que queremos eliminar. por ejemplo, para eliminar el dato anterior pondremos:
$("#elemento").removeData("Alberto");
Con esto hemos eliminado el dato señalado.
El método data tiene algunas particularidades que es conveniente señalar:
El método size() sirve para indicar el número de elementos que tiene un objeto jQuery. Este método no tiene argumentos por lo que su empleo es bastante simple:
parrafos=$("p").size()
En el código anterior obtenemos en la variable parrafos el número de párrafos que contiene la página.
Podemos usar con la misma utilidad la propiedad .length, la cual indica igualmente el número de elementos que contiene un objeto jQuery:
parrafos=$("p").length
Este código dará el mismo resultado que el anterior, es decir, nos devuelve el número de párrafos de la página.
Tal vez queramos usar jQuery junto con otras librerías o "frameworks". El problema puede surgir cuando las otras librerías utilicen también los mismos métodos y símbolos que utiliza jQuery. En concreto el signo $ (dolar), utilizado también por otras librerías (por ejemplo MooTools). Al usar el signo $ en varias librerías esto puede crear un conflicto entre ellas haciendo que javascript deje de funcionar.
Para solucionar esto, jQuery ha creado un método que anula el uso del signo $, este es el método $.noConflict();. Al anular el uso del signo dolar ( $ ) podemos usar otros modos de utilizar jQuery.
En primer lugar podemos utilizar el modo extendido, es decir escribir jQuery en lugar del signo dolar: ej:
$.noConflict();
jQuery(document).ready(function() {
jQuery("#capa1").css("color","red");
jQuery("#capa1").html("hola mundo");
});
Como segunda opción, podemos guardar el objeto "noConflict" en una variable, la cual la utilizaremos como abreviatura de "jQuery":
jq=$.noConflict();
jq(document).ready(function() {
jq("#capa1").css("color","red");
jq("#capa1").html("hola mundo");
});
En tercer lugar, si tenemos un bloque de código en jQuery dentro de una función, podemos pasarle a esa función como argumento el signo $ (dolar). De esta manera podemos usarlo dentro de la función:
$.noConflict();
jQuery(document).ready(function($) {
$("#capa1").css("color","red");
$("#capa1").html("hola mundo");
});
Hemos dado en este manual los métodos más usados con jQuery. Sin embargo en jQuery hay más métodos. El propósito de este manual no es indicar todos los métodos de jQuery, sino tener unas nociones mínimas para poder usarlo con eficacia. Es por eso por lo que no los incluimos todos, además de que se alargaría excesivamente el manual.
La lista de todos los métodos de jQuery la tenemos en su página oficial de apis: http://api.jquery.com/. Aquí los encontrarás todos reunidos por categorías. Tal vez la única dificultad que puedas encontrar es que la página está en inglés, aunque con un buen traductor, no te será dificil entenderla.
Hasta aquí el manual de Jquery. Espero que os haya servido pra mejorar vuestras páginas.
Sugerencias:
aprendeweb@aprende-web.net. Envia un
Visita nuestro blog par saber en qué estamos trabajando: Aprende Web Blog
Más sobre anyelguti en http://anyelguti.16mb.com