Question

我正在创建一个由模板库调用的辅助函数。我的助手现在生成一个带有guid id的div（用作占位符）以及每秒调用一次服务器以获取内容以放入该占位符的脚本 - 基本上是这个代码：

$.get( url + guid).done( result => $("#" +guid).html( result));

所以 - 一切都很完美 - 除非我的帮助函数在表格块中使用 - 在这种情况下，因为<div>不是tbody的允许子项 - chrome将其踢出...所以当我实际上在以后出现行和列时 - 它们不再位于表格块内 - 它们会高出它。

现在，当然问题是你在模板渲染器中没有上下文 - 也就是说我完全不可能知道我是否在桌子上。

任何人都可以想到任何方式我可以放置任何类型的占位符 - 文本，注释，以及我最初渲染的html中的任何内容，我可以多次更新它并且我插入的新html将始终完全出现在同一个原始模板指令的位置和上下文是什么？

Answer 1

您可以使用<span></span>元素。

Here是一个非常简单的解释：

标记用于对文档中的内联元素进行分组。

标签本身不会发生任何视觉变化。

标记提供了一种向文本的一部分添加钩子的方法   文件的一部分。

Answer 2

我找到了一个答案-我仍然想要一个更好的答案，但是如果我使用<！-开始->和<！-停止->这样的注释，则可以替换他们与此：

var inner = document.body.innerHTML;
var comment = s => "<!-- " + s + " -->";
var reg = new RegExp( comment("start") + "(.|\n)*" + comment("stop"), "gim");
var replaced = inner.replace( reg, comment("start") + "<tr><td>1</td><td>2</td></tr>" 
                          + comment("stop"));
document.body.innerHTML = replaced;

要谨慎构造正则表达式，以使其与自身不匹配：)无论如何-不理想地替换整个innerhtml-但这是我的答案，除非有人能提出更好的建议。因为注释不要可以从任何地方移动。

在html中创建一个安全的占位符

2 个答案: