为什么在< script>之后需要$（document）.ready标签？ [英] Why is $(document).ready needed after the <script> tag?
问题描述
为什么< script> 标记后需要 $（文件）.ready ？
如果我们不使用 $（文件）.ready 会怎样？
What would happen if we don't use $(document).ready?
推荐答案
$（document）.ready 是javascript代码，因此必须用
$(document).ready is javascript code, so it has to be written in <script> element and after jQuery is loaded.
如果你不写 $（文件） .ready ，您的代码不会等待 DOM 完全加载并立即执行javascript代码。
If you don't write $(document).ready, your code will not wait for DOM to load completely and execute the javascript code immediately.
如果你正在使用/操纵DOM中的一些元素的< head> 中使用脚本，你需要 ready ，否则你将获得 null / undefined 。
如果您在< body> 的末尾使用脚本，那么您将安全，因为所有元素都已加载。
If you're using script in <head> that is using/manipulating some elements from DOM, you'll need ready, otherwise you'll get null/undefined.
If you're using script at the end of <body>, then you'll be safe as all the elements are loaded.
来自 jQuery Docs 的报价
虽然JavaScript提供了在呈现页面时执行代码的加载事件，但在完全接收到所有资源（如图像）之前，不会触发此事件。在大多数情况下，只要完全构造DOM层次结构，就可以运行脚本。传递给.ready（）的处理程序保证在DOM准备好后执行，因此这通常是附加所有其他事件处理程序并运行其他jQuery代码的最佳位置。当使用依赖于CSS样式属性值的脚本时，在引用脚本之前引用外部样式表或嵌入样式元素很重要。
While JavaScript provides the load event for executing code when a page is rendered, this event does not get triggered until all assets such as images have been completely received. In most cases, the script can be run as soon as the DOM hierarchy has been fully constructed. The handler passed to .ready() is guaranteed to be executed after the DOM is ready, so this is usually the best place to attach all other event handlers and run other jQuery code. When using scripts that rely on the value of CSS style properties, it's important to reference external stylesheets or embed style elements before referencing the scripts.
在代码依赖于加载的情况下资产（例如，如果需要图像的尺寸），则代码应放在load事件的处理程序中。
In cases where code relies on loaded assets (for example, if the dimensions of an image are required), the code should be placed in a handler for the load event instead.
示例？当然！
在头部没准备好
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<script>
alert($('#myname').val());
</script>
</head>
<body>
<input type="text" value="Tushar" id="myname" />
</body>
</html>
在正文结束时
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<input type="text" value="Tushar" id="myname" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<script>
alert($('#myname').val());
</script>
</body>
</html>
准备就绪
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
alert($('#myname').val());
});
</script>
</head>
<body>
<input type="text" value="Tushar" id="myname" />
</body>
</html>
< script> 在结尾处< body> ; ，您可以省略 ready 。
这篇关于为什么在< script>之后需要$（document）.ready标签？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
