jQuery .each()没有将消息记录到控制台
问题描述:
我非常简单地实现了jQuery的每种方法。我复制了以下代码https://api.jquery.com/each/以了解每种方法的工作方式。在本地测试了html/js代码失败之后,我将它复制到了JSBin中,并且看到它工作。有人能指出我出错的地方吗?我怀疑这是jQuery的CDN我挂......jQuery .each()没有将消息记录到控制台
HTML
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="ex.js"></script>
</head>
<body>
<ul>
<li>foo</li>
<li>bar</li>
</ul>
</body>
</html>
JS
$("li").each(function(index) {
console.log(index + ": " + $(this).text());
});
答
使用准备功能推荐的方法是这样的:
$(function() {
$("li").each(function(index) {
console.log(index + ": " + $(this).text());
});
});
这也是在API中提到的第一种语法。您可能会注意到,代码中没有“准备就绪”。这是因为该处理程序将在加载DOM后进行初始化。
jQuery提供了几种附加DOM准备就绪的函数的方法。以下所有语法是等价的:
- $(处理器)
- $(文件)。就绪(处理)
- $( “文件”)。就绪(处理)
- $(“ 。IMG”)。就绪(处理)
- $()准备就绪(处理)
在jQuery 3.0,只有建议第一种语法;其他语法仍然有效,但不推荐使用。
答
你应该jQuery's on ready方法加载JS脚本是这样的:
$(function() {
$("li").each(function(index) {
console.log(index + ": " + $(this).text());
});
});
.ready()
方法d只要 页面的文档对象模型(DOM)变得可以安全操作,就可以运行JavaScript代码。此 通常是执行用户查看或与页面交互之前所需任务的好时机,例如添加事件 处理程序和初始化插件。当通过 连续调用此方法添加多个函数时,它们在DOM准备好时按其添加的 顺序运行。从jQuery 3.0开始,jQuery确保在一个处理程序中发生的异常不会阻止随后执行的 添加的处理程序。
希望这会有所帮助!
脚本元素需要在它尝试访问的元素之后,和/或你可以将JS显示在文档就绪处理程序中。 (JSBin可以自动执行此操作 - 当然JSFiddle默认使用onload处理程序。) – nnnnnn