3

我正在创建一个网络小部件。所以基本上我从远程服务器加载脚本并在容器 div 中显示内容。我需要向服务器发送额外的参数，例如过滤一些内容或选择显示，所以我有两个选项

在脚本标签中传递数据（我在代码中动态生成脚本）

<script src="http://localhost/wordpress/?ai1ec_requirejs_widget&ai1ec=action:posterboard|no_navigation:true|request_type:jsonp"></script>
<div id="timely"></div>

将数据作为数据属性传递<div>

<script src="http://localhost/wordpress/?ai1ec_requirejs_widget&ai1ec=action:posterboard|no_navigation:true|request_type:jsonp"></script>
<div id="timely" data-action="view" data-no-navigation="true" data-request-type="jsonp" ></div>

到目前为止，出于这个原因，我选择了第一种方法：如果我在请求脚本中包含数据，我不必等待 DOM 准备好获取<div>过滤事件的值。我正在加载的脚本只是一个异步加载 requirejs 的小脚本。要求 js 加载后立即进行 ajax 调用以获取数据（无需等待 DOM 准备好，因为我已经拥有所需的所有信息），当数据到达时，如果 dom 准备好，它就会启动附加事件处理程序。否则我必须等待 DOM 准备就绪，然后再调用获取数据

我的想法是，如果我包括

<script src="http://localhost/wordpress/?ai1ec_requirejs_widget&ai1ec=action:posterboard|no_navigation:true|request_type:jsonp"></script>

作为第一个脚本，它将开始异步下载 require.js，然后更快地启动一切，但也许我完全错了。

你怎么看？

4

1 回答 1

0

除了你提到的担忧：

我会在脚本标签中传递数据，因为这样你就有了一个配置小部件的点。拥有多个配置点可能会发生冲突或成为混乱的根源。

此外，执行所有过滤似乎是脚本的关注点，而不是div（因为那是一个视图元素），所以从这个角度来看，让脚本处理所有这些信息也更有意义。这样，您还可以最大限度地减少通过网络传输的数据量。当您可以在服务器端执行此操作时，为什么要加载所有信息然后在客户端对其进行过滤？

编辑

我误解了你的场景！老实说，我认为任何一种方式都行得通。但是，您可以通过向 中添加信息来最小化您编写的 Javascript 的数量，div我认为这些信息是可以的，因为它在语义上是合适的。它还将为正在阅读代码的任何人提供更多上下文。

于 2012-09-20T19:54:30.857 回答