格式化动态的HTML内容...例如：{{foobar.data}}

要格式化动态的HTML内容，你可以使用模板引擎来解决。模板引擎可以通过将变量插入到预定义的HTML模板中，然后生成最终的HTML内容。

以下是一个使用JavaScript的示例，使用了Handlebars.js模板引擎：

1. 首先，引入Handlebars.js库。你可以在HTML文件中添加以下代码来加载Handlebars.js：

<script src="https://cdn.jsdelivr.net/npm/handlebars/dist/handlebars.min.js"></script>

2. 在HTML文件中，定义一个包含动态内容的HTML模板。使用双大括号{{}}来表示动态内容的占位符。例如：

<script id="template" type="text/x-handlebars-template">
  <h1>{{title}}</h1>
  <p>{{content}}</p>
</script>

3. 在JavaScript文件中，编写代码来加载HTML模板和动态数据，并将其组合生成最终的HTML内容。示例代码如下：

// 获取HTML模板
var templateSource = document.getElementById('template').innerHTML;

// 编译模板
var template = Handlebars.compile(templateSource);

// 动态数据
var data = {
  title: 'Hello',
  content: 'This is a sample content.'
};

// 将数据插入到模板中
var html = template(data);

// 将最终的HTML内容插入到页面中
document.getElementById('output').innerHTML = html;

在以上代码中，我们首先获取了HTML模板的内容，并使用Handlebars.compile函数编译模板。然后，我们定义了一个包含动态数据的JavaScript对象data。接下来，我们使用template函数将数据插入到模板中，生成最终的HTML内容。最后，我们将最终的HTML内容插入到<div id="output">元素中。

这样，你就可以根据动态数据生成格式化的HTML内容了。