在 jQuery 中，length 属性用于返回 jQuery 对象中匹配元素的数量。它不是一个方法，而是一个直接可访问的属性，返回的是一个整数值。当你通过选择器拿到一组元素后，用 .length 看一眼里到底有多少个元素，是最常规的操作之一。
length 属性的直接前身是 size() 方法，两者的返回值一致。但 size() 从 jQuery 1.8 开始被标记为废弃（deprecated），到了 3.0 版本被彻底移除。现在你翻阅任何较新的 jQuery 文档，官方都明确推荐使用 length 属性来替代。
为什么优先使用 length 属性而不是 size() 方法？
这里面的逻辑很清晰：性能差异。size() 本质上是一个函数，调用它需要经过一次函数调用开销，而 length 是一个直接暴露的属性，访问它不需要任何额外的执行栈操作。在单次调用中这点差距微乎其微，但如果在循环或高频触发的事件中反复使用，.length 累积下来的节省就值得重视了。加上 size() 已从 jQuery 3.0 中移除，继续使用它意味着你无法升级 jQuery 版本，这也是一个无法忽视的维护隐患。
语法
$(selector).length
这个属性返回的是当前 jQuery 对象中匹配元素的个数。注意它返回的是原生数值类型，不是 jQuery 对象，因此不能继续链式调用其他 jQuery 方法。
课程知识要点
-
直接属性访问：
.length是属性而非方法，不需要括号调用，访问速度比方法调用更快。 -
size() 已废弃：jQuery 1.8 起废弃
size()，3.0 起移除，新代码中不应该再出现size()。 -
返回值是整数：
.length返回的是数字，常用于条件判断（如检查元素是否存在）、循环迭代上限等场景。 -
判断元素是否存在：
if ($('.item').length)是判断页面中是否存在匹配元素的惯用写法，值为 0 时条件为假，简洁实用。
示例：统计页面元素数量
下面这个例子演示了 .length 属性的基本使用方式。页面上有几个分类的编程相关项，点击按钮后会分别统计每一类有多少个。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>length 属性示例 · 编程学习</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function () {
$("#btn-count").click(function () {
// 统计各类元素的数量
var languageCount = $(".language").length;
var frameworkCount = $(".framework").length;
var toolCount = $(".tool").length;
alert(
"统计结果：\n" +
"编程语言: " + languageCount + " 项\n" +
"框架: " + frameworkCount + " 项\n" +
"开发工具: " + toolCount + " 项"
);
});
// 利用 length 判断元素是否存在
if ($(".language").length) {
console.log("页面上存在编程语言相关元素，共 " + $(".language").length + " 个");
}
});
</script>
</head>
<body>
<h4>使用 jQuery length 属性统计元素数量</h4>
<p class="language">JavaScript</p>
<p class="language">Python</p>
<p class="language">Go</p>
<p class="framework">Vue</p>
<p class="framework">React</p>
<p class="tool">VS Code</p>
<p>点击下方按钮查看各类元素的数量：</p>
<button id="btn-count">统计数量</button>
</body>
</html>
点击按钮后，弹窗会分别显示三类元素各自的计数。代码里也演示了用 if ($(".language").length) 来判断特定元素是否存在于页面中——这是 jQuery 开发中非常普遍的条件判断模式。
个人经验与实用建议
在日常开发中，.length 最常被我用于两个场景。第一是元素存在性检查：在执行任何操作前先确认目标元素确实在 DOM 里，避免在空上调用方法导致静默失败。第二是批量操作的边界控制：当你用 $.each() 或 for 循环遍历元素时，.length 可以作为循环上限，确保不越界。
还有一个小技巧：当你怀疑某段选择器代码没有选中任何元素时，最快速的调试手段就是在控制台输入 $("你的选择器").length。返回 0 就说明选择器没命中，返回大于 0 就说明命中了对应数量的元素。这个用法简单到不起眼，但在排查 DOM 操作的预期问题时十分常用。
如果你现在还在维护的旧代码中看到了 size()，建议尽早替换为 .length。这个替换成本很低，直接全局搜索 size() 替换即可。这样当项目需要升级 jQuery 版本时，不至于在这件小事上被动。
