jquery - 将页面内容推送到左浮动的 div 下方

Question

我正在处理的网站的某些页面使用脚本自动创建基于页面标题的目录。但是，我在获取“toc”div 以将页面的其余内容推送到其下方时遇到了一些问题。

TOC div 在我页面的最里面的 div 中，“content”。出于这个原因，我无法使用 clear: both; 将我的内容 div 强制低于目录。像往常一样。我不想将它移到“内容”之外，因为我希望 TOC 位于页面的 H1 标题下方，并且我想避免 <div></div>尽可能多地发送垃圾邮件。

下面是一个带有简单布局的 jsfiddle，展示了我的意思。请注意，TOC 具有背景色。如果我将其宽度设置为 100%，它可以工作，但颜色会拉伸(stretch)，这不是我想要的。

http://jsfiddle.net/n3yKf/2/

我可能会更改生成目录的脚本，因为我不太喜欢使用 <a> 的脚本标题。但是，我的问题是 CSS，所以我认为我现在不会过多地讨论它。

尽管如此，仍然欢迎就创建更好脚本的好方法提出建议(希望有源代码；我讨厌黑盒解决方案)。

Answer 1

你可以做一些事情

您可以将相同的类添加到您的每个 h2 标签，然后将两者都应用到 css 中的那个类；

h2 {
    clear:both;
}

您也可以将您的内容包装在一个单独的 div 中，然后将两者都应用到该 div

我还修改了您的 jsfiddle 以使用一个变量迭代 jQuery，因此您只需通过连接所有 anchor 标记来追加()一次。

http://jsfiddle.net/n3yKf/5/