javascript - seleccionar - recorrer tabla jquery

jQuery para recorrer elementos con la misma clase

Question

Tengo un montón de divs con el testimonial la clase y quiero usar jquery para recorrerlos para verificar si cada div es una condición específica. Si es cierto, debe realizar una acción.

¿Alguien sabe cómo haría esto?

Answer 1

Con un simple for loop:

var testimonials= $(''.testimonial'');
for (var i = 0; i < testimonials.length; i++) {
  // Using $() to re-wrap the element.
  $(testimonials[i]).text(''a'');
}

Answer 2

En JavaScript ES6 usando el operador spread ...

[...document.querySelectorAll(''.testimonial'')].forEach( el => {
    el.style.color = ''red'';
});

sobre una colección similar a una matriz dada por Element.querySelectorAll()

[...document.querySelectorAll(''.testimonial'')].forEach( el => {
  el.style.color = ''red'';
  const stuff = `Element ${el.tagName} with ID #${el.id} says: ${el.textContent}`; 
  console.log( stuff );
});

<p class="testimonial" id="1">This is some text</p>

<div class="testimonial" id="2">Lorem ipsum</div>

Answer 3

Es bastante simple hacer esto sin jQuery en estos días.

Sin jQuery:

Simplemente seleccione los elementos y use el método .forEach() para iterar sobre ellos:

var testimonials = document.querySelectorAll(''.testimonial'');
Array.prototype.forEach.call(testimonials, function(elements, index) {
    // conditional here.. access elements
});

Answer 4

Más preciso:

$.each($(''.testimonal''), function(index, value) { 
    console.log(index + '':'' + value); 
});

Answer 5

Prueba este ejemplo

Html

<div class="testimonial" data-index="1">
    Testimonial 1
</div>
<div class="testimonial" data-index="2">
    Testimonial 2
</div>
<div class="testimonial" data-index="3">
    Testimonial 3
</div>
<div class="testimonial" data-index="4">
    Testimonial 4
</div>
<div class="testimonial" data-index="5">
    Testimonial 5
</div>

Cuando queremos acceder a esos divs que tienen data-index superior a 2 , necesitamos este jQuery.

$(''div[class="testimonial"]'').each(function(index,item){
    if(parseInt($(item).data(''index''))>2){
        $(item).html(''Testimonial ''+(index+1)+'' by each loop'');
    }
});

Fiddle ejemplo de trabajo

Answer 6

Puede que me falte una parte de la pregunta, pero creo que simplemente puede hacer esto:

$(''.testimonial'').each(function() {
    if(...Condition...) {
        ...Do Stuff...
    }
}

Answer 7

Puedes hacer esto de manera concisa usando .filter . El siguiente ejemplo ocultará todos los div .testimonial que contengan la palabra "algo":

$(".testimonial").filter(function() {
    return $(this).text().toLowerCase().indexOf("something") !== -1;
}).hide();

Answer 8

Utilice cada: '' i '' es la posición en la matriz, obj es el objeto DOM que está iterando (también se puede acceder a través del contenedor $(this) jQuery $(this) ).

$(''.testimonial'').each(function(i, obj) {
    //test
});

Compruebe la referencia de la API para más información.

Answer 9

prueba esto...

$(''.testimonial'').each(function(){
    //if statement here 
    // use $(this) to reference the current div in the loop
    //you can try something like...


    if(condition){

    }


 });

Answer 10

puedes hacerlo de esta manera

$(''.testimonial'').each(function(index, obj){
    //you can use this to access the current item
});

Answer 11

jQuery''s .eq () puede ayudarlo a atravesar elementos con un enfoque indexado.

var testimonialElements = $(".testimonial");
for(var i=0; i<testimonialElements.length; i++){
    var element = testimonialElements.eq(i);
    //do something with element
}

Answer 12

Sin jQuery actualizado

document.querySelectorAll(''.testimonial'').forEach(function (element, index) {
    element.innerHTML = ''Testimonial '' + (index + 1);
});

<div class="testimonial"></div>
<div class="testimonial"></div>

Answer 13

$(''.testimonal'').each(function(i,v){
  if (condition) {
    doSomething();
  }
});

Answer 14

divs  = $(''.testimonial'')
for(ind in divs){
  div = divs[ind];
  //do whatever you want
}