将 p 放在 span 内或强制 h:outputText 在文本周围生成 div

Question

在我的项目中，我从用户那里获取原始文本并将其发送到服务器以执行以下操作

使用

<h:outputText value="#{wordTypeBean.wordTypeValues}" escape="false" />

简而言之，我在服务器端做所有的 html 标记。该return编辑结果是这样的（当然，作为一个长字符串，缩进了可读性的结果）：

<h:outputText value="#{wordTypeBean.wordTypeValues}" escape="false" />

但是在文本周围h:outputText生成span元素。尽管到目前为止我没有看到任何问题。但是，我有一种感觉，这是不对的，因为我读的是在HTML它是非法的地方p里面span。

有没有办法强制围绕来自 Bean 的文本h:outputText生成div，或者有没有合法/更好的方法来实现这一点？

这是 Chrome 的 DevTool 元素选项卡中的一个片段：

Answer 1

这个，

<h:outputText value="#{wordTypeBean.wordTypeValues}" escape="false" />

不会生成任何额外的 HTML。所以你实际上没有那个标签。

根据您的 HTML DOM 检查器屏幕截图，您似乎确实拥有以下内容：

<h:outputText id="wordTypeEditor" value="#{wordTypeBean.wordTypeValues}" escape="false" />

实际上，这将生成一个<span>元素，因为您已经明确指定了一个必须在客户端结束的id属性，即该属性。

摆脱该id属性，将其移动到<h:panelGroup layout="block">包装<h:outputText>.

<h:panelGroup id="wordTypeEditor" layout="block">
    <h:outputText value="#{wordTypeBean.wordTypeValues}" escape="false" />
</h:panelGroup>

如果您不需要在 ajax 中的其他地方引用它，只需 a<div id="wordTypeEditor">也可以。

<div id="wordTypeEditor">
    <h:outputText value="#{wordTypeBean.wordTypeValues}" escape="false" />
</div>