我试图用这个来理解$(document).ready，也许是愚蠢的JSFIDDLE example（这基本上使用jQuery来绘制10个带有标题Graph1的div ...）这里有很多问题noWrap - in <body> 3}}和here。但我想要的是理解相对于DOM ...的工作流程/顺序。为什么我应该使用它，为什么我不应该使用它。我试图用这个愚蠢的例子来更好地理解它
具体来说，使用jsfiddle示例，为什么它不能用$(document).ready(function(){和<!DOCTYPE html>
<html>
<head>
<title>Access Links</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- <script src="../src/jquery-1.11.0.min.js"></script> <!-- works here with $(document).ready(function(){ commented out -->
<!-- DOES NOT WORK here with $(document).ready(function(){ -->
</head>
<body>
<!-- <script src="../src/jquery-1.11.0.min.js"></script> <!-- works here with $(document).ready(function(){ commented out -->
<!-- DOES NOT WORK here with $(document).ready(function(){ -->
<div class="container" id="graphs">
<!-- My divs will go here -->
</div>
<!-- <script src="../src/jquery-1.11.0.min.js"></script> <!-- works here with $(document).ready(function(){ commented out -->
<!-- DOES NOT WORK here with $(document).ready(function(){ -->
<script>
//$(document).ready(function(){
//--------- START: Draw all your divs------------------------------------------>
var numberOfDivs =10;
for (var x = 1; x <= numberOfDivs; x += 1) {
var $div = $('<div class="chart half"><h3 id="g' + x + '">Graph' + x + '</h3><svg id="chart' + x + '"></svg></div>');
$('#graphs').append($div);
}
//--------- END: Draw all your divs------------------------------------------>
//}
</script>
<!-- <script src="../src/jquery-1.11.0.min.js"></script>
<!-- DOES NOT work here with $(document).ready(function(){ commented out -->
<!-- DOES NOT WORK here with $(document).ready(function(){ -->
</body>
</html>
注释掉？
注意：也许这个例子太愚蠢或不清楚我想要什么，但有了你的意见，我希望能够澄清它并获得更好的理解。
{{1}}
答案 0 :(得分：0)
如果你想了解函数$（document）.ready，我建议你阅读jQuery的源代码。就像这样：
// HANDLE: $(function)
// Shortcut for document ready
} else if ( jQuery.isFunction( selector ) )
return jQuery( document ).ready( selector );
如果选择器是$（）中的函数，$（document）.ready将工作.BTW，我想你想知道这个函数的执行时间，这个函数在DOM树加载完成时会起作用