你什么时候需要使用$(document).ready()? [英] when do you need to use $(document).ready()?

查看:155
本文介绍了你什么时候需要使用$(document).ready()?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我很好奇什么情况确实需要使用jquery的$(document).ready()或prototype的dom:loaded或此事件的处理程序的任何其他变体。

I'm curious what situations exactly require the use of jquery's $(document).ready() or prototype's dom:loaded or any other variant of a handler for this event.

在我测试过的所有浏览器中,在结束标记之后立即开始与html元素和DOM进行交互是完全可以接受的。 (例如

In all the browsers i've tested, it's entirely acceptable to begin interacting with html elements and the DOM immediately after the closing tag. (e.g.

<div id="myID">
 My Div
</div>
<script type="text/javascript">
$('#myID').initializeElement();
</script>

所以此时我想知道 $(文件).ready()仅仅是为了减少编写在页面加载期间运行的javascript代码所涉及的思路。在使用 $(document).ready()的情况下,经常会出现渲染问题例如,首先开始绘制页面的浏览器之间的弹出和工件以及当页面准备好时实际执行的javascript。

So at this point i'm wondering whether $(document).ready() is merely there to reduce the thinking involved in writing javascript code that runs during page load. In the case of using $(document).ready() there is regularly rendering issues such as popping and 'artifacts' between the browser first starting to draw the page and the javascript actually executing when the page is 'ready'.

是否有任何情况 $(document).ready()是必需的吗?

Are there any scenarios where $(document).ready() is required?

我是否有任何理由不应该编写初始化脚本如所示?

Are there any reasons I shouldn't be writing initialization scripts as demonstrated?

推荐答案

对于外部脚本,$(document).ready()可能是唯一的选择。内联脚本吧有点不同。

In the case of external scripts $(document).ready() could be the only option. As for inline script it is a little different.

根据HTML 4.01标准,上面显示的初始化技术是否合法似乎有点含糊不清:

According to HTML 4.01 standard it seems a little ambiguous whether or not the initialization technique shown above is legal:


http://www.w3.org/TR/html401/interact/scripts.html#h-18.2.4

执行时执行的脚本加载文件或许可以
动态修改文件的内容
。执行此操作的能力
取决于脚本语言
本身(例如,某些供应商支持的HTML对象模型
中的document.write
语句)。

Scripts that are executed when a document is loaded may be able to modify the document's contents dynamically. The ability to do so depends on the scripting language itself (e.g., the "document.write" statement in the HTML object model supported by some vendors).


之前和处理任何SCRIPT
元素之后,HTML文档被限制为符合HTML DTD。

HTML documents are constrained to conform to the HTML DTD both before and after processing any SCRIPT elements.

在HTML 5草案中,似乎非常清楚这种做法是完全支持的:

In the HTML 5 draft it seems very clear that this practice is fully supported:


http://www.w3.org/TR/ html5 / scripting-1.html#scripting-1

以下示例显示了
脚本元素如何用于定义
函数,然后由文档的其他
部分使用。它还显示了
脚本元素如何用于
调用脚本,而文档是
被解析,在这种情况下为
初始化表单的输出。

The following sample shows how a script element can be used to define a function that is then used by other parts of the document. It also shows how a script element can be used to invoke script while the document is being parsed, in this case to initialize the form's output.



<script>
 function calculate(form) {
   var price = 52000;
   if (form.elements.brakes.checked)
     price += 1000;
   if (form.elements.radio.checked)
     price += 2500;
   if (form.elements.turbo.checked)
     price += 5000;
   if (form.elements.sticker.checked)
     price += 250;
   form.elements.result.value = price;
 }
</script>
<form name="pricecalc" onsubmit="return false">
 <fieldset>
  <legend>Work out the price of your car</legend>
  <p>Base cost: £52000.</p>
  <p>Select additional options:</p>
  <ul onchange="calculate(form)">
   <li><label><input type=checkbox name=brakes> Ceramic brakes (£1000)</label></li>
   <li><label><input type=checkbox name=radio> Satellite radio (£2500)</label></li>
   <li><label><input type=checkbox name=turbo> Turbo charger (£5000)</label></li>
   <li><label><input type=checkbox name=sticker> "XZ" sticker (£250)</label></li>
  </ul>
  <p>Total: £<output name=result></output></p>
 </fieldset>
 <script>
  calculate(document.forms.pricecalc);
 </script>
</form>

这篇关于你什么时候需要使用$(document).ready()?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆