jQuery: सूची तत्वों की संख्या की गणना करें?

134

मुझे एक सूची मिली है जो कुछ सर्वर साइड कोड से उत्पन्न हुई है, इसमें jQuery के साथ अतिरिक्त सामान जोड़ने से पहले मुझे यह पता लगाने की आवश्यकता है कि इसमें कितने आइटम पहले से हैं।

<ul id="mylist">
    <li>Element 1</li>
    <li>Element 2</li>
</ul>

jquery html

— टॉम
स्रोत

225

प्रयत्न:

$("#mylist li").length

बस जिज्ञासु: आपको आकार जानने की आवश्यकता क्यों है? क्या आप इसका उपयोग नहीं कर सकते:

$("#mylist").append("<li>New list item</li>");

?

— cletus
स्रोत

3

मैं नए को जोड़ने के लिए उपयोग कर रहा हूं, लेकिन मुझे उन मदों की संख्या पर एक सीमा मिल गई है जो सूची में हो सकते हैं, इस स्थिति में उपयोगकर्ता अभी भी अधिकतम 4 आइटम जोड़ सकता है, लेकिन 2 आ सकते हैं पिछले राज्य से। :)

— टॉम

35

ध्यान दें कि jQyery डॉक्स का उपयोग करना चाहिये .lengthअधिक .size()एक समारोह कॉल की भूमि के ऊपर से बचने के लिए। api.jquery.com/size

— जो 18

4

आकार () १.ery को jquery में चित्रित किया गया था और यह अब लंबाई () का उपयोग करने के लिए कहता है ।

— gloomy.penguin

8

@ gloomy.penguin नोट जो .lengthएक फ़ंक्शन नहीं है।

— हेक्सासैनाइड

मक्खी पर तत्व की चौड़ाई को पुनर्गणना करने के लिए मुझे <li> गिनती की आवश्यकता है।

— हिस्टो

51

var listItems = $("#myList").children();

var count = listItems.length;

बेशक आप इसके साथ घनीभूत हो सकते हैं

var count = $("#myList").children().length;

JQuery की अधिक मदद के लिए, http://docs.jquery.com/Main_Page शुरू करने के लिए एक अच्छी जगह है।

— निक एलन
स्रोत

5

बस सुरक्षित रहने के लिए, $ ("# माईलिस्ट") करें। बच्चों ("ली") की लंबाई; यदि आप कभी भी किसी भी कारण से सूची के अंदर अन्य वस्तुओं को जोड़ते हैं, तो आप कोड की इस छोटी रेखा के बारे में नहीं भूलेंगे।

— SgtPooki

10

कॉल करते समय आपके पास एक ही परिणाम होता है। आकार () विधि या .length संपत्ति लेकिन .length गुण पसंद किया जाता है क्योंकि इसमें फ़ंक्शन कॉल का ओवरहेड नहीं होता है। तो सबसे अच्छा तरीका:

$("#mylist li").length

— एलेक्स गुयेन
स्रोत

4

मुझे लगता है कि यह करना चाहिए:

var ct = $('#mylist').children().size();

— एंड्रयू बैरेट
स्रोत

4

और निश्चित रूप से निम्नलिखित:

var count = $("#myList").children().length;

नीचे संघनित किया जा सकता है: ('वैर' को हटाकर जो चर सेट करने के लिए आवश्यक नहीं है)

count = $("#myList").children().length;

हालाँकि यह क्लीनर है:

count = $("#mylist li").size();

— ROARSTAR
स्रोत

2

क्या यह विधि भी बच्चे के शीर्ष-उल-तत्वों के लि-टैग की गिनती नहीं है?

— atripes

2

यह कहना कि "'वेरिएबल' 'वैरिएबल सेट करने के लिए आवश्यक नहीं है" ओवरसिमप्लाइज़िंग है। यदि आप 'var' का उपयोग नहीं करते हैं, तो आपके सभी varibles ग्लोबल हो जाएंगे। देखें stackoverflow.com/questions/1470488/...

— राफेल अल्मीडा

3

प्रयत्न

$("#mylist").children().length

— Nui_CpE
स्रोत

1

सूची तत्वों की संख्या की गणना करें

alert($("#mylist > li").length);

— M.Ganji
स्रोत

1

सूची तत्वों की संख्या की गणना करने के लिए एक और तरीका:

var num = $("#mylist").find("li").length;
console.log(num);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="mylist">
  <li>Element 1</li>
  <li>Element 2</li>
  <li>Element 3</li>
  <li>Element 4</li>
  <li>Element 5</li>
</ul>

स्निपेट का विस्तार करें

— पेनी लियू
स्रोत

0

$("button").click(function(){
    alert($("li").length);
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
  <meta charset="utf-8">
  <title>Count the number of specific elements</title>
</head>
<body>
<ul>
  <li>List - 1</li>
  <li>List - 2</li>
  <li>List - 3</li>
</ul>
  <button>Display the number of li elements</button>
</body>
</html>

स्निपेट का विस्तार करें

— Bashirpour
स्रोत