एक ही वर्ग के तत्वों के माध्यम से लूप करने के लिए jQuery

Question

मेरे पास कक्षा के साथ divs का भार है testimonialऔर मैं एक विशेष स्थिति के सही होने पर प्रत्येक div की जांच करने के लिए उनके माध्यम से जॉकरी का उपयोग करना चाहता हूं। यदि यह सही है, तो उसे कार्रवाई करनी चाहिए।

क्या किसी को पता है कि मैं यह कैसे करूँगा?

Answer 1

प्रत्येक का उपयोग करें: ' i' सरणी में पद objहै, DOM ऑब्जेक्ट है जिसे आप पुनरावृत्त कर रहे हैं (jQuery आवरण के माध्यम से भी पहुँचा जा सकता है $(this))।

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

चेक API संदर्भ में अधिक जानकारी के लिए।

Comments

I, obj पैरामीटर के साथ फ़ंक्शन बहुत मदद करता है। यदि बस प्रत्येक का उपयोग किया गया था, तो यह पुनरावृत्त नहीं था।

— ९

@Darwindeeds सही! फ़ंक्शन का उपयोग प्रत्येक आइटम को संसाधित करने के लिए वास्तविक पुनरावर्तक द्वारा किया जाता है। लौटने falseसे पुनरावृत्ति रुक ​​जाएगी।

— कीस सी। बक्कर

यह इंगित करने योग्य है, कि "obj" डोम ऑब्जेक्ट होगा, जबकि $ (यह) jQuery ऑब्जेक्ट है।

— एंड्रियास

खिचड़ी भाषा हम jQuery करते हैं (यह 'उल ली')। उस तत्व की लंबाई प्राप्त करने के लिए लंबाई?

— Techie_28

+1 $(this)ऑब्जेक्ट को एक्सेस करने के सुझाव के लिए ... objडोम ऑब्जेक्ट होने के नाते सीधे उदाहरण के लिए फ़ंक्शन संलग्न करने की अनुमति नहीं देता हैobj.empty()

— Fr0zenFyr

Answer 2

इसे इस्तेमाल करे...

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


    if(condition){

    }


 });

Comments

FYI करें: break;नहीं टूटेगा आप का उपयोग करना चाहिएreturn false;

— Kolob Canyon

Answer 3

इन दिनों jQuery के बिना यह करना बहुत आसान है।

बिना jQuery के:

बस तत्वों का चयन करें और उन पर पुनरावृति करने के लिए .forEach()विधि का उपयोग करें:

const elements = document.querySelectorAll('.testimonial');
Array.from(elements).forEach((element, index) => {
  // conditional logic here.. access element
});

पुराने ब्राउज़रों में:

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

Answer 4

इस उदाहरण का प्रयास करें

एचटीएमएल

<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>

जब हम उपयोग करना चाहते उन divsहै जो data-indexअधिक से अधिक 2तो हम इस jQuery की जरूरत है।

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

वर्किंग उदाहरण फिडल

Answer 5

आप इसे इस तरह से कर सकते हैं

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

Answer 6

jQuery का .eq () एक अनुक्रमित दृष्टिकोण के साथ तत्वों के माध्यम से आगे बढ़ने में आपकी सहायता कर सकता है।

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

Comments

यह वास्तव में सबसे कुशल दृष्टिकोण है।

— अमीन सेतायसेफ़र

Answer 7

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

Comments

हालांकि, आप jquery वस्तुओं को नहीं देते हैं, बस डोम तत्व

— celwell

@celwell jQuery से आपके लिए सब कुछ करने की उम्मीद नहीं कर सकता है। यह अपनी खुद की jQuery वस्तु बनाने की बात है $(ind)।

— गोल्डबिशप

Answer 8

आप इसे संक्षिप्त रूप से उपयोग कर सकते हैं .filter। निम्न उदाहरण सभी .testimonial divs को छिपा देगा जिसमें "कुछ" शब्द होगा:

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

Answer 9

पाश के लिए एक सरल के साथ:

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

Answer 10

बिना jQuery के अद्यतन

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

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

Comments

लगभग एक ही जवाब यहाँ पहले से ही है, मुझे लगता है कि आपको मौजूदा

— ओलेह रयालचेन्को

Answer 11

मैं सवाल का हिस्सा नहीं हो सकता है, लेकिन मेरा मानना ​​है कि आप बस यह कर सकते हैं:

$('.testimonial').each((index, element) => {
    if (/* Condition */) {
        // Do Something
    }
});

यह jQuery की प्रत्येक विधि का उपयोग करता है: https://learn.jquery.com/using-jquery-core/iterating/

Answer 12

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

Answer 13

ज़्यादा सही:

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

Comments

यह अच्छा है यदि आप अधिक कार्यात्मक दृष्टिकोण से पढ़ना / लिखना पसंद करते हैं।

— 21

Answer 14

जावास्क्रिप्ट ES6 .forEach () द्वारा दिए गए एक सरणी-जैसे नोडलिस्ट संग्रह परElement.querySelectorAll()

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

<p class="testimonial" id="1">This is some text</p>
<div class="testimonial" id="2">Lorem ipsum</div>

Comments

प्रसार ऑपरेटर + सरणी संकेतन की जरूरत नहीं है, निश्चित रूप से doc..torAll.forEach()पर्याप्त होगा?

— ऐबकविस्मिथ

धन्यवाद। पूर्ण रूप से। [...ArrayLike]उस समय के लिए उपयोग किया गया था जब क्वेरीलेटरऑल के लिए समर्थन नहीं था .forEach। @aabbccsmith

— रोको सी। बुल्जन

Answer 15

आप वर्ग प्रशंसापत्र के साथ सभी तत्वों के माध्यम से लूप करने के लिए jQuery $ प्रत्येक विधि का उपयोग कर सकते हैं। i => संग्रह में तत्व का सूचकांक है और वैल आपको उस विशेष तत्व का उद्देश्य देता है और आप अपने तत्व के गुणों को आगे बढ़ाने और अपनी स्थिति की जांच करने के लिए "वैल" का उपयोग कर सकते हैं।

$.each($('.testimonal'), function(i, val) { 
    if(your condition){
       //your action
    }
});