Question

这是我做的：

var a = $(document.getElementById("panelForm:tableId01"));
$("<p:outputLabel value='Testing'/>").appendTo(a);

它没有显示标签但是如果我这样做，例如，它可以工作：

$("<font color='red'>Red</font>").appendTo(a);

Answer 1

您似乎完全忽略了JSF和JavaScript的背景。

JSF基本上是一个HTML代码生成器。要自己查看，请创建一个（简单且有效）的JSF页面，并在您喜欢的webbrowser中打开它。右键单击并选择查看源。你看到了什么？是的，它是一个和所有HTML代码！如果JSF已经完成了它的工作，你就不应该看到任何JSF标签，原因很简单，因为webbrowser不理解它们。它只能理解HTML。

JavaScript是一种客户端语言，它在webbrowser中运行，而不是在webserver中运行。作为证据，当你在物理上不同的机器上运行webserver和webbrowser并调用JavaScript onclick="alert('peek-a-boo')"时，你会在webbrowser中看到它，而不是在webserver中。 JavaScript可以看到HTML DOM树（通过document对象可用的任何内容，例如document.getElementById("someId")）。 JavaScript无法查看负责生成该HTML的原始服务器端源代码，更不用说执行它了。对于jQuery而言，它与基于JavaScript的库的简单原因并无不同。

您需要以不同方式解决您的具体功能要求。如果你想动态添加JSF组件，那么你应该通过JSF本身而不是通过JavaScript来实现。这里的答案显示了很多方法之一：How to dynamically add JSF components。但是如果你坚持使用jQuery，那么你应该自己指定JSF组件的HTML输出，但是你基本上仍然完全忽略了JSF的观点。请仔细阅读以下链接。

另见：

What is the need of JSF, when UI can be achieved from CSS, HTML, JavaScript, jQuery?

Answer 2

您无法使用"$('<p:outputLabel value='Testing'/>')"。因为它是PrimeFaces标签lib。它会在页面呈现时生成html标记（例如：'<label class="my-class ui-outputlabel ui-widget" id="j_idt19:j_idt22">Testing</label>'）。所以你应该使用jquery来表示html标签。例如，如下所示：

<p:outputLabel value='Testing' styleClass='my-class'/>"

var a = $(document.getElementById("panelForm:tableId01"));
$("label.my-class").appendTo(a);

通过jQuery添加JSF标签/组件

2 个答案:

另见：