使用PrototypeJs，如何异步加载jsp页面答案

【问题标题】：Using PrototypeJs, how to load a jsp page asynchronously使用PrototypeJs，如何异步加载jsp页面
【发布时间】：2014-02-10 01:49:26
【问题描述】：

我们在我们的应用程序中使用 Spring 和 PrototypeJs。基本上我想要一个模板页面，然后用一些值填充模板页面。我找到了一个 JQuery.load 方法，但我们没有使用 JQuery。

我发现的最接近的东西是原型模板对象，它只是一个字符串。我可以用 Javascript 制作一个模板，如下所示：

var template1 = new Template("user id: #id name is <span class name='userName'>#name</span>");

然后一旦我将所有数据作为 json 填写空白，但这还不够。我想显示标签等并且更复杂，理想情况下只需加载此模板文件一次，稍后再填写值。不使用backbone.js 或angularjs 甚至可能吗？

我想我的问题是，如何更好地构建页面？目前我正在用javascript创建我的整个页面（例如new Element（“div”）.addClassName（“something”））所以我希望以jsp或其他形式创建我的页面“模板”，然后填写空白。

我将所有数据以 json 格式显示在页面上。

【问题讨论】：

我不会发布答案，因为我没有特定于库的解决方案；但是如果你有 JSON 来构建页面，你能不能只通过你的 create 函数来运行它？您可能需要设计自己的协议来构建页面，但我不明白为什么您不能自己做——假设我理解您的话。
它“感觉不对”。我想将我的格式更清晰易读地放在一个单独的 html/jsp 类型文件中，然后用上面模板中的数据填充它。我在这方面没有太多经验，所以我不确定我所做的是否正确。
如果它有效，它就有效——只是有人可能发明了一种更好的方法 :) 由于 JSON 是人类可读的并且是 c 型可读对象，因此您可以通过以下方式定义您的“模板”写出 JSON——很多 nodejs 都会这样做，尽管有些人使用 YAML 来使其更具可读性。如果它适合您的喜好，我认为它没有问题。
谢谢。有时当我们需要混合其他不是常规 div/span 元素的自定义标签时，这很困难

标签： javascript ajax json templates prototypejs

【解决方案1】：

Template 类对于如何创建其成员非常灵活。为了便于阅读，我要做的是将您的模板编码为 HTML 中的实际页面元素，然后在页面加载时将其删除，然后再使用它来填充您的 JSON。

<div id="template-1" class="#{classname}">
  <h1>#{headline}</h1>
  <p>#{description}</p>
</div>
<div id="articles"></div>

<script type="text/javascript">
var tmp = $('template-1').remove();
tmp.writeAttribute('id',false);
var template = new Template(tmp.outerHTML);
// do whatever with it
$('articles').insert(template.evaluate(myJSON));
</script>

这应该让你开始。以这种方式工作的主要好处是您不必一直使用反斜杠引号并将所有内容写在一行中，或者将其与 + 符号一起抨击。

【讨论】：

感谢您的回答。我认为这是个好主意。我可以重复使用相同的模板，并使用相同模板的新值循环遍历我的 json 数据！
如果您在循环中执行此操作，您可以通过将“您必须启用 JavaScript”消息放入模板中来杀死两只鸟，并在使用模板之前将其删除，就像我删除的一样ID。