Limitar la acción de jQuery a clases de elementos
Trabajando con jQuery podemos definir acciones a solo determinados elementos. La forma de hacerlo es muy similar a lo que hacíamos con los estilos CSS (ves como hay que leer esa parte antes?), cuando definíamos un estilo para solamente una clase determinada de elementos.
<a class="enlacemedio" href="#">Enlace Uno</a>
<a class="enlaceinferior" href="#">Enlace Uno</a>
o bien con el id famoso:
<a id="enlacemedio" href="#">Enlace Uno</a>
<a id="enlaceinferior" href="#">Enlace Uno</a>
Pues para aplicar acciones a uno u otro elemento de la página web, no solo es muy similar, sino que se hace exáctamente del mismo modo, aprovechando esos tipos o clases definidos a esos elementos.
Por ejemplo. Digamos que solo quiero aplicar la acción de la ventanita del ejemplo anterior al enlace de abajo. Bastaría, por un lado con definirle un tipo de estilo o mejor dicho, un identificador, a dicho enlace. Eso se hacía así:
href="http://www.comocreartuweb.com">Visita ComoCrearTuWeb!</a></p>
Y por otro lado, tendríamos que indicar también en el archivo funciones.js, que la acción va dirigida no a todos los enlaces (etiquetas a) sino tan solo al identificado como "enlacetipocctw". Esto se logra con este codigo:
{
$("a#enlacetipocctw").click(function(evento)
{
alert("Te diriges a una gran página, CCTW!");
});
});
Si modificamos tal que así, la acción definida en el archivo funciones.js solo se aplicará a los enlaces con ese tipo de estilo. Por supuesto, si en lugar de definirlo con un id, hubieramos definido una clase de estilo, con class="enlacetipocctw" en el Html, en el archivo funciones.js la modificación habría tenido que ser así:
{
$("a.enlacetipocctw").click(function(evento)
{
alert("Te diriges a una gran página, CCTW!");
});
});
es decir, con un punto en lugar de la almohadilla, tal y como se hace con los estilos CSS, claro.
Introdución al jQuery:
