我正在开发一个实现 Disqus 评论的博客，并且我正在努力尽可能多地使用 HTML5 语义标记。
这是一个例子<article />（本身在一个<section />），相当简单：
<article class="post">
<header>
<h2>Title</h2>
<p class="posted-on">Posted on <time datetime="2012-07-28T13:00:24+01:00">July 28th 2012</time>.</p>
</header>
<p>Lorem ipsum dolor sit amet...</p>
<p>Lorem ipsum dolor sit amet...</p>
<!-- blog comments -->
</article>
通过上述结构，我在语义上不确定在哪里整合文章的评论。
- A <footer /> http://dev.w3.org/html5/spec/the-footer-element.html#the-footer-element显然是不合适的（“页脚元素不划分内容；它不引入新的部分。”）
- Disqus 使用异步 JavaScript 来创建
<iframe />包含评论小部件，所以<p />似乎也不合适。
我是否过度考虑了语义标记的事情：最好将其粘贴到<div />不担心吗？
有一个HTML5 规范中的示例 http://www.w3.org/TR/2013/CR-html5-20130806/sections.html#the-article-element获取带有评论的博客文章。在我看来，这是有道理的。
您的示例可能如下所示：
<article class="post">
<header>
<h1>Title</h1>
<p class="posted-on">Posted on <time datetime="2012-07-28T13:00:24+01:00">July 28th 2012</time>.</p>
</header>
<p>Lorem ipsum dolor sit amet...</p>
<p>Lorem ipsum dolor sit amet...</p>
<section>
<h1>Comments</h1>
<article><!-- comment 1--></article>
<article><!-- comment 2--></article>
<article><!-- comment 3--></article>
<section>
</article>
旁注：我认为你的“posted-on“ 会更好地适合footer http://www.w3.org/TR/2013/CR-html5-20130806/sections.html#the-footer-element代替header http://www.w3.org/TR/2013/CR-html5-20130806/sections.html#the-header-element。所以你的header可以省略，因为它只包含标题。所以你的例子可能看起来像：
<article class="post">
<h1>Title</h1>
<footer class="posted-on">Posted on <time datetime="2012-07-28T13:00:24+01:00">July 28th 2012</time>.</footer>
<p>Lorem ipsum dolor sit amet...</p>
<p>Lorem ipsum dolor sit amet...</p>
<section>
<h1>Comments</h1>
<article><!-- comment 1--></article>
<article><!-- comment 2--></article>
<article><!-- comment 3--></article>
<section>
</article>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
