// 獲取所有匹配元素的數(shù)量
const elements = document.querySelectorAll('選擇器');
const count = elements.length;

console.log(`找到了 ${count} 個(gè)元素`);

<div class="item">項(xiàng)目1</div>
<div class="item">項(xiàng)目2</div>
<div class="item">項(xiàng)目3</div>

<script>
// 獲取所有 class="item" 的元素?cái)?shù)量
const items = document.querySelectorAll('.item');
console.log(items.length); // 輸出：3

// 獲取所有 <p> 標(biāo)簽的數(shù)量
const paragraphs = document.querySelectorAll('p');
console.log(paragraphs.length);

// 獲取特定容器內(nèi)的元素?cái)?shù)量
const containerItems = document.querySelectorAll('.container .item');
console.log(containerItems.length);
</script>

// 方法1：直接獲取數(shù)量
const count1 = document.querySelectorAll('.item').length;

// 方法2：先獲取NodeList再獲取長(zhǎng)度
const nodeList = document.querySelectorAll('.item');
const count2 = nodeList.length;

// 方法3：轉(zhuǎn)換為數(shù)組后獲取長(zhǎng)度（如果需要使用數(shù)組方法）
const array = Array.from(document.querySelectorAll('.item'));
const count3 = array.length;

// 方法4：使用擴(kuò)展運(yùn)算符
const count4 = [...document.querySelectorAll('.item')].length;

// 檢查是否存在元素
if (document.querySelectorAll('.item').length > 0) {
    console.log('找到了元素');
}

// 統(tǒng)計(jì)特定條件下的元素?cái)?shù)量
const visibleItems = document.querySelectorAll('.item:not(.hidden)');
console.log(`可見項(xiàng)目數(shù)：${visibleItems.length}`);

// 動(dòng)態(tài)更新計(jì)數(shù)
function updateCount() {
    const count = document.querySelectorAll('.item').length;
    document.getElementById('counter').textContent = `總數(shù): ${count}`;
}