YUI：确保 DOM 元素和脚本准备就绪
如果我将内联脚本放在与其交互的 DOM 元素之后，我是否仍然应该使用 YUI 3 的 domready 事件？
我没有注意到任何问题，而且似乎我可以指望浏览器按顺序加载页面。 （我已经使用YUI().use('node', ...来确保我需要的 YUI 函数已加载，因为 YUI 脚本是一个单独的文件。）有吗有一种方法可以加快 YUI 2 日历等小部件的加载速度吗？
我加载 适当的脚本在我的页面的元素中。我使用YUI().use('yui2-calendar', ...来确保日历小部件可用。不幸的是，当我加载日历页面时，这会导致短暂但明显的延迟如果我省略YUI().use('yui2-calendar', ...代码，那么它的显示不会有明显的延迟 - 但我想这可能会导致日历不显示在 。如果 YUI 脚本没有及时加载，有什么办法吗？关于#2，是否可以减少日历不存在然后显示的视觉伪影？
我通过指定父 div 的高度和宽度使其稍微好一些，以便至少已经分配了空间 =>加载时的移动最小化。
If I put my inline script after the DOM elements it interacts with, should I still use YUI 3's domready event?
I haven't noticed any problems, and it seems like I can count on the browser loading the page sequentially. (I already useYUI().use('node', ...to make sure the YUI functions I need have been loaded since the YUI script is a separate file.)Is there a way to speed up the loading of widgets like YUI 2's calendar?
I load the appropriate script in<head>element of my page. I useYUI().use('yui2-calendar', ...to make sure the Calendar widget is available. Unfortunately, this causes a short but noticeable delay when I load my page with the calendar. If I omit theYUI().use('yui2-calendar', ...code then it shows up without a noticeable delay - but I guess this could cause the Calendar to not show up at all if the YUI script doesn't load in time?With regards to #2, is it possible to reduce the visual artifact of the calendar not being present and then showing up?
I've made it slightly better by specifying a height and width for the parent div so that at least the space is already allocated => minimal shifting around when it does load.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
如果访问 DOM 元素的代码位于标记中的这些元素之后，则不需要 domready。这通常适用于 DOM 脚本，而不仅仅是 YUI。
yui2-calendar 与 yahooapis.com/2.8.0r4/build/calendar/calendar-min.js 不同。前者包括一些包装代码，用于在 YUI 3 实例环境中沙箱日历 API 及其依赖项。如果您将 YUI 2 脚本包含在 中， （您可以说应该将其放置在 的末尾），您不需要使用 yui2-calendar。这样做只会加载日历代码两次。否则，要利用 YUI 3 的动态异步加载，您可以从 中删除
<脚本 src="http://yui.yahooapis.com/combo?2in3.1/2.8.0/build/yui2-yahoo/yui2-yahoo.js&2in3.1/2.8.0/build /yui2-dom/yui2-dom.js&2in3.1/2.8.0/build/yui2-event/yui2-event.js&2in3.1/2.8.0/build/yui2-calendar/yui2-calendar.js ">
您可以在页面加载时包含渲染日历的 CSS 和标记，然后渲染到标记容器中。我不认为 YUI 2 日历具有渐进增强现有标记的概念，但我可能是错的。它应该用生成的标记破坏静态表标记，并使 UI 生动起来。
You don't need domready if the code that accesses DOM elements comes after those elements in the markup. This applies to DOM scripting in general, not just YUI.
yui2-calendar is not identical to yahooapis.com/2.8.0r4/build/calendar/calendar-min.js. The former includes some wrapping code to sandbox the Calendar API and its dependencies in the YUI 3 instance environment. If you're including the YUI 2 scripts in the <head> (which you arguably should place at the end of the <body>), you don't need to use yui2-calendar. Doing so just loads the Calendar code twice. Otherwise, to leverage YUI 3's dynamic async loading, you can remove the <script>s from the <head> and just use('yui2-calendar'). You can get the appearance of speeding up the time to render by including the yui2-* combo <script> in your markup after the yui-min.js seed file. Note the Loader will always fetch the css file, so you don't need to include that in the markup.
<script src="http://yui.yahooapis.com/combo?3.1.0/build/yui/yui.js"></script>
<script src="http://yui.yahooapis.com/combo?2in3.1/2.8.0/build/yui2-yahoo/yui2-yahoo.js&2in3.1/2.8.0/build/yui2-dom/yui2-dom.js&2in3.1/2.8.0/build/yui2-event/yui2-event.js&2in3.1/2.8.0/build/yui2-calendar/yui2-calendar.js"></script>
You can include the css and markup of a rendered Calendar on page load, then render into the markup container. I don't think YUI 2 calendar has the notion of progressive enhancement of existing markup baked in, but I could be wrong. It should clobber the static table markup with its generated markup and vivify the UI.
如果它位于上述节点之后，则不需要 DOMContentLoaded（或 domready）。
If it's after the said nodes in question, then you don't need
DOMContentLoaded(or domready).