Cómo obtener todos los anclajes relacionados con div id en jQuery

los desarrolladores de sitios necesitan para obtener una colección de elementos contenidos dentro de otro elemento en una página Web. Considere un elemento DIV que contiene una descripción del producto. DIV que también puede contener múltiples etiquetas de anclaje, o enlaces, que apuntan a otras páginas que tratan sobre el producto. El uso de la biblioteca jQuery JavaScript, puede agarrar todos los anclajes dentro de ese DIV y manipularlos. Todo lo que necesita para utilizar esta biblioteca de programación es un enlace al archivo que contiene el código de jQuery y el ID de la DIV que contiene sus anclajes.

Instrucciones

1 Poner en marcha un editor HTML o el Bloc de notas y abrir cualquier documento HTML.

2 Añadir esta línea (sin comillas) a la sección de la cabeza del documento: "<script> Visita de la Casa Blanca </a>

<a href="http://www.nasa.gov"> Visita la NASA </a>

</ Div>

<Input type = "button" value = "Test" onclick = "prueba de retorno ( 'div1')" />

Este DIV contiene dos etiquetas de anclaje. El botón, al hacer clic, llama a una función JavaScript denominada "prueba" y que pases función de identificación del DIV.

3 Coloque el código JavaScript se muestra a continuación en la sección de escritura del documento:

prueba de función (divID) {

var = anclas getAnchors (divId);

for (var i = 0; i <anchors.length; i ++) {

alert ( "Anchor Text =" anclas + [i] .innerText);

}

}

getAnchors función () {divId

anclas var = $ ( "#" divID + + "> A");

anclajes de retorno;

}

La función de "prueba" llama a una función llamada "getAnchors" y pasa a través de esa función Identificación del DIV. La función "getAnchors" recupera todos los anclajes de la DIV y los devuelve a la función de "prueba". La función de "prueba" almacena los anclajes en la variable "anclas". Tenga en cuenta que la función "getAnchors" tiene una declaración de jQuery. Esta declaración añade el "#" para el comienzo de la ID del DIV. En este ejemplo, que se convierte en "# div1" porque el ID del DIV es "div1." El "> una" porción de la declaración representa los elementos de los "niños" en el elemento DIV padres. Dado que sólo quiere que los hijos de anclaje dentro del DIV, el código utiliza la letra "a" decir jQuery para localizar todos los elementos secundarios dentro del DIV que son elementos de anclaje.

4 Guarde el documento y verlo en su navegador. Los dos enlaces y el botón aparecen. Clic en el botón. El evento de clic de botón llama a la función "test". Esta función llama a la función "getAnchors". La función "getAnchors" se lleva todos los puntos de anclaje del DIV y los devuelve a la función de "prueba". Esa función a continuación, muestra los valores de texto para cada uno de los anclajes.

Consejos y advertencias

• Usted puede hacer varias cosas útiles con anclajes después de recuperar desde un DIV. Iterar a través de su colección de anclaje usando JavaScript regulares o incluso "cada una" función de jQuery de. Por ejemplo, mientras que bucle a través de sus anclajes, podría cambiar su apariencia o simplemente examinar sus valores de texto como se muestra en los siguientes pasos. la página web de jQuery tiene información útil sobre el "cada" función que ayuda a los desarrolladores manipular colecciones de elementos de la página Web.