Question

如何为HTML网页创建可重复使用的字符串？

我希望以下HTML行可以在我的网页中作为一个小字符串“对象”重复使用：

[<span class="sgreentxt">root</span>@<span class="sbluetxt">localhost</span> <span class="sorangetxt">~ </span>]

由webrowser解释并显示在屏幕上的“[root @ localhost~]”。

这个对象相当于“cli = [root @ localhost~]”所以不是输入那么长的代码串而是只需键入类似“cli”的内容，而html会将其识别为javascript字符串printline或其他东西，输出其他代码，将被解释为HTML并适当显示。我怎样才能实现这一点，并能够通过同一个网页多次完成。注意：document.getElementById（）每个网页只能运行一次。

Answer 1

那里有很棒的客户端模板库。我个人喜欢http://handlebarsjs.com/。这对我来说看起来更像服务器端的东西。您可能希望您的服务器为您执行此操作。如果你真的想在客户端做这件事并且不在乎他们的可能是SEO的含义而且FOUSC工件和适当的模板库太多了，那么你可能会做这样的事情。

＆＃13;

var template = "[<span class=\"sgreentxt\">root</span>@<span class=\"sbluetxt\">localhost</span> <span class=\"sorangetxt\">~ </span>]";
var targets = Array.from(document.querySelectorAll("[data-replace='cli']"));
targets.forEach(function(target) { target.outerHTML = template; });

＆＃13;

<ul>
  <li><span data-replace="cli"></span></li>
  <li><span data-replace="cli"></span></li>
  <li><span data-replace="cli"></span></li>
  <li><span data-replace="cli"></span></li>
</ul>

＆＃13;

如何创建可重用的HTML字符串对象？

1 个答案: