如果Javascript代码块不在HTML文件末尾，而是使用jQuery的$(document).ready(function() {...})，它会减慢页面显示速度吗？
据说Javascript代码应该全部放在HTML文件的末尾，以便先显示页面内容，让用户看到一些东西（这样用户就满意地看到一些东西而不是再等12秒，对于例子）。
但为了更好地封装 HTML 并匹配 Javascript 代码，例如“图像轮播”，通常会将 HTML 和 Javascript 放置在一个文件中，因此在整个最终 HTML 文件中都会有 Javascript 代码块与 HTML 代码混合在一起。
但是如果所有这些Javascript代码块都使用jQuery的$(document).ready(function() { ... })来执行任务，那么页面显示是不是也很快？我认为不如 Javascript 实际放置在 HTML 文件末尾时那么快，但已经足够接近了，因为它只是向就绪事件队列添加了一个函数。
It is said that Javascript code should be all placed at the end of HTML file, so that the page content is shown first, for the user to see something (so that the user is satisfied to see something instead of waiting another 12 seconds, for example).
But to better encapsulation of the HTML and match Javascript code, such as an "Image Carousel", then usually the HTML and Javascript is placed in one single file, so there are Javascript code blocks all intermixed with HTML code throughout the final HTML file.
But what if all these Javascript code blocks use jQuery's $(document).ready(function() { ... }) to perform the task, then won't the page display be very fast as well? I think not as fast as when the Javascript is actually placed at the end of the HTML file, but close enough, because it merely adds a function to the ready event queue.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
我认为重点是将js放在页面底部（通常就在结束
标签内），以便在js时显示页面内容>正在下载。如果您的 jQuery 代码在单独的
.ready()调用中分布在整个 HTML 中，那么无论如何，它都不会运行，直到完成满载。那么问题是 HTML 中有多少 javascript？如果有很多，那么它会减慢每个脚本后面的任何内容的显示速度。如果代码量相对较少，那么它可能不会产生太大的明显差异。
如果尽快显示页面内容对您来说确实很重要，那么请将所有脚本放在内容之后。
我个人不会仅仅为了关联而将 javascript 与 HTML 混合在一起。如果您开始删除/附加恰好包含脚本的内容，则可能会出现意外结果。我宁愿使用适当命名的类和 ID，以及大量代码注释。
另请记住，这些
.ready()调用在jQuery加载之前不会起作用，这意味着它需要位于页面顶部，或者至少在您第一次打电话之前。所以这又回到了哪个对你来说更重要的问题。如果你想让内容尽快可见，就把所有js放在底部。如果您想要混合 js 和 HTML 的方法，那么在显示页面时将会有一些延迟。
I think the point is to place the js at the bottom of the page (usually just inside the closing
</body>tag) so that the content of the page is displayed while the js is downloading.If you have your jQuery code spread out throughout the HTML in separate
.ready()calls, then no matter what, it won't run until the<body>has fully loaded. So the question would be how much javascript do you have in the HTML?If there's quite a bit, then it will slow down the display of any content that comes after each script. If it is a relatively small amount of code, then it won't likely make much noticeable difference.
If it is really important to you to have the page's content displayed as soon as possible, then place all scripts after the content.
I personally wouldn't mix javascript with HTML just for the sake of association. You could have unexpected results if you start removing/appending content that happens to include a script. I'd rather use appropriately named classes and IDs, as well as lots of code comments.
Also keep in mind that those
.ready()calls won't work untiljQueryhas loaded, which would mean that it would need to be at the top of the page, or at least before your first call.So again it gets back to the question of which is more important to you. If you want the content visible as quickly as possible, place all js at the bottom. If you want your method of intermixing js and HTML, you'll have some delay in displaying the page.