Cómo llamar a un div con clase específica en JQuery

Escrito por sara williams | Traducido por analia moranchel
  • Comparte
  • Twittea
  • Comparte
  • Pin
  • E-mail
Cómo llamar a un div con clase específica en JQuery
JQuery fue diseñado para hacer más sencillo el agregado de interacción en páginas web para los diseñadores. (Ryan McVay/Digital Vision/Getty Images)

JQuery fue diseñado para hacer más sencillo el agregado de interacción en páginas web para los diseñadores. Ante este hecho, su método de "selección" de partes de la página está modelada a partir de selectores de hojas de estilo en cascada (CSS, por sus siglas en inglés). Esto significa que puedes adjuntar funciones y eventos a partes de las páginas web con selectores de estilo CSS. Cuando desees renombrar un div con un nombre de clase específica en jQuery, por ejemplo, puedes utilizar una combinación del selector de etiquetas y de nombres de clase del código CSS. Este código se parece a "div .classname" y conseguirá cualquier div con el mismo nombre de la clase, sin importar si hay 1 ó 10.

Nivel de dificultad:
Moderadamente fácil

Otras personas están leyendo

Instrucciones

  1. 1

    Abre tu página web en Bloc de notas y agrega este código si necesitas agregar jQuery a la página:

    <script type=”text/javascript” src=”https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js”></script>

  2. 2

    Agrega etiquetas "<script>" al código de la página web y colócalos por encima de "</head>" o sobre "</body>" según tu preferencia. Dentro de las etiquetas "<script>", escribe una función para hacer que espere hasta que la página termine de cargar:

    <script type=”text/css”> $(document).ready(function() { }); </script>

    Esto te ayudará a prevenir errores. Todo código de script jQuery irá dentro de las llaves de la función de "document ready" ("documento listo").

  3. 3

    Selecciona tus div por nombre de clase con el mismo formato de la selección como lo harías en una hoja de estilos. Para los nombres de clase, este es el nombre de clase precedido por un punto. Al seleccionar en jQuery, sin embargo, coloca un signo pesos frente a un par de paréntesis y coloca el selector de comillas dentro de los mismos:

    $(“.classname”);

    Para seleccionar sólo los div que comparten el mismo nombre de clase, escribe "div" delante del selector de clase:

    $(“div .classname”);

  4. 4

    Agrega una función jQuery al selector:

    $(“div .classname).click();

    La función de "click()" añade un evento "clic" al selector. Esto le dice al script que cumpla una función cuando el usuario haga clic en un div de una clase determinada. Abre una nueva función dentro de "click()" o cualquier función que desees utilizar, para escribir que "algo" que ocurra en el evento:

    $(“div .classname).click(function() { // Escribe código aquí para que ocurra algo cuando el usuario haga clic en el div o divs });

No dejes de ver

Filtrar por:
  • Mostrar todos
  • Artículos
  • Galerías de fotos
  • Videos
Ordenar:
  • Más relevante
  • Más popular
  • Más reciente

No se encuentran artículos disponibles

No se encuentran slideshows disponibles

No se encuentran videos disponibles