jquery - 计算 HTML 文件中的节数

Question

你好， 我有一个简单的一页网站，由几个部分组成。当我在 html 文件中编写脚本时，它会正确地给出部分的数量。代码是这样的:

var number = $("#sections li").length
console.log(number);

但是当我从外部文件运行完全相同的代码时，它不起作用。

有什么想法吗？

Answer 1

可能的原因:

• 您的 JavaScript 可能在所有 HTML 完全加载之前就已执行
• 您的 CSS 选择器和代码实际上并没有告诉您有多少 <section>元素有多少，它告诉你有多少<li>元素存在于 <foo id="sections"> 下, 这是故意的吗？
• 您的代码在 jQuery 不可用的上下文中执行 - 另外，我注意到，您没有在 jQuery 中使用任何值得使用的东西。

通过使用纯 ol' JavaScript，您的代码将更具可移植性(并且更快):

var count = document.getElementById("sections").getElementsByTagName("li").length;

或者(便携性稍差:需要现代浏览器):

var count = document.querySelectorAll("#sections li").length;

更具体地说:

window.addEventListener('DOMContentLoaded', function(e) {

    var count = document.querySelectorAll("#sections li").length;
    console.log( count );
} );