这几天在用VUE-CLI做一个demo，然后在渲染一个列表的时候遇到了一个挺不可思议的事情：
<!--这只是一小部分，v-for的内容在上方-->
<div class="detail-evaluate">
<p>
<h3>用户评价（{{value.evaluatenumber}}）</h3>
<i>{{value.percent}}好评</i>
</p>
</div>渲染后我在浏览器里面得到的结果是
然后我把p标签换成aside之后，得到的结果是这样的：
这让我很懵逼。。。。
之后我去MDN去查P标签相关的资料（https://developer.mozilla.org...）
终于知道为什么渲染总是出问题了，官方解释是这样的
P的起始标签是必需的，结束标签在以下情形中可以省略。<p>元素后紧跟<address>,<article>,<aside>,<blockquote>,<div>,<dl>,<fieldset>,<footer>,<form>,<h1>,<h2>,<h3>,<h4>,<h5>,<h6>,<header>,<hr>,<menu>,<nav>,<ol>,<pre>,<section>,<table>,<ul>或另一个<p>元素；或者父元素中没有其他内容了，而且父元素不是<a>元素
我的P标签后面的元素是h3，这会被填充内容后解析为我省略了P标签的闭合标签，所以就渲染出了一个空的P标签，后面的闭合标签同理，刚开始我还考虑过是不是VUE的模板是不是有什么问题，但是我很快否定了这个想法，毕竟VUE出现了这么久，也迭代了很多个版本，这种问题不可能会出现。
总结一下就是HTML5的标准还是需要再去多了解多总结~
注：本文内容来自互联网，旨在为开发者提供分享、交流的平台。如有涉及文章版权等事宜，请你联系站长进行处理。