1

我想在加载/渲染后立即添加一个适用于某种类型的 DOM 对象的脚本。这种类型的对象总是与 javascript 脚本一起出现，我想将它们放在某个标记中。这样做是否正确？如果是这样，我怀疑span不是在这里使用的最佳标签，因为它可能与内部元素的显示方式交互。我应该使用什么标签？

<span>
  <div>the dom object to be modified by the script</div>
  <script>theJavascriptFunctionThatModifiesTheDomObject()</script>
</span>
4

3 回答 3

1

由于以下原因，我怀疑这是在 DOM 加载特定元素之后加载脚本的最佳方式：-

  • 它使您的页面加载速度变慢。
  • 用户将以离散的方式看到您的完整页面。

相反，您应该这样做：-

  • 为您的元素指定一个选择器。
  • 在正文末尾包含您的单个 javascript 代码。
  • 使用该脚本更新 DOM 元素。

编辑：解决方案1：将您的 JS 附加到正文的末尾，以便它可以访问所有 DOM 元素。由于您使用 ajax 在 DOM 中注入元素，因此您可以为 XHR 对象定义一个成功处理程序，它将修改您在 DOM 中的元素。

解决方案2：您可以在您的 JS 中定义一个单独的方法，并将该方法绑定到某个事件上。在您的 HTML 标记中定义一个数据事件属性，并在您的成功处理程序中将元素附加到 DOM，使用 jquery 数据方法提取数据事件并触发该事件。

至少它会让你的标记远离脚本逻辑。

一些有用的链接：

加快网站速度的最佳实践 - 雅虎

为什么我们应该在最后加载脚本 - SO Link

于 2013-04-12T12:42:09.493 回答
0

我会避免这种方法；脚本会阻止页面加载——因此，如果您在几个 dom 元素之后执行此操作，页面会运行缓慢（或者如果发现错误则根本不会）

尝试使用 jquery onready - 这里的例子：http: //api.jquery.com/ready/

并且脚本 [通常] 需要放在页面底部以允许页面首先加载……这个规则有一些例外，例如众所周知的现代化脚本库需要首先进入，以便它可以在加载时评估 dom

于 2013-04-12T12:55:07.923 回答
0

这里的问题是脚本标签不知道它在 DOM 中的位置。最好做一些事情，比如为你想要改变的元素添加一个类。在 DOM 准备就绪后，您查找元素并施展魔法。

于 2013-04-12T12:40:28.993 回答