在輸出到 HTML 之前計算數據中的列表項

Question

我有一個使用 ajax 返回的列表，看起來像這樣......

console.log(data);

<ul><li>Item 1</li><li>Item 2</li><li>Item 3</li></ul>

我將它插入到這樣的 HTML 元素中......

$("#output").html(data);

這工作正常，但我想在將其輸出到元素之前計算列表項的數量。 我已經嘗試了以下但它只給了我字符數......

console.log(data.length);

我哪里錯了？ 在輸出 HTML 之前有沒有辦法做到這一點？

Answer 1

您的數據只是一個字符串，因此您可以使用 jQuery 將其轉換為 jquery 對象，然后從該對象中選擇li元素並獲取長度。

 const data = '<ul><li>Item 1</li><li>Item 2</li><li>Item 3</li></ul>' const html = $(data); console.log(html.find('li').length) $("#output").html(html);

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="output"></div>