将 JS 文件包含在使用 ui:include 包含的 xhtml 文件中

发布于 2024-12-07 19:19:45 字数 1003 浏览 0 评论 0原文

我将使用一个示例来说明我的问题：

outerfile.xhtml：

<h:head>
    <h:outputScript library="js" name="jquery-1.6.2.js" />
    <h:outputScript library="js" name="outer.js" />
</h:head>

<h:body>
    <h:panelGroup id="inner_panel">
      <ui:include src="innerfile.xhtml" />
    </h:panelGroup>
</h:body>

innerfile.xhtml：

<ui:composition ... >
    <h:head>
        <h:outputScript library="js" name="jquery-1.6.2.js" />
        <h:outputScript library="js" name="inner.js" />
    </h:head>

    <h:body>
        <h:panelGroup>
          I Am Text in The Inner File!
        </h:panelGroup>
    </h:body>
</ui:composition>

我的问题：

可以按照我的方式在内部文件中声明 js 文件吗？
我是否需要（并且应该）在内部文件中再次声明公共（jquery-1.6.2.js）？
如果我使用 AJAX 取消渲染并重新渲染 inner_panel 会发生什么？内部包含的标头会重新加载吗？

原文

I will ilustrate my question using an example:

outerfile.xhtml:

<h:head>
    <h:outputScript library="js" name="jquery-1.6.2.js" />
    <h:outputScript library="js" name="outer.js" />
</h:head>

<h:body>
    <h:panelGroup id="inner_panel">
      <ui:include src="innerfile.xhtml" />
    </h:panelGroup>
</h:body>

innerfile.xhtml:

<ui:composition ... >
    <h:head>
        <h:outputScript library="js" name="jquery-1.6.2.js" />
        <h:outputScript library="js" name="inner.js" />
    </h:head>

    <h:body>
        <h:panelGroup>
          I Am Text in The Inner File!
        </h:panelGroup>
    </h:body>
</ui:composition>

My questions:

Is it okay to declare the js files in the inner file the way I did?
Do I need (And Should I) declare the common (jquery-1.6.2.js) again in the inner file?
What happens if I un-render and the re-render inner_panel using AJAX? Will the inner-included headers be reloaded?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

憧憬巴黎街头的黎明 2024-12-14 19:19:45

按照我的方式在内部文件中声明js文件可以吗？

不可以。您也不应该在包含文件中指定。这只会导致 HTML 无效。正如您现在所看到的，将导致：

<html>
  <head>
    <script></script>
  </head>
  <body>
    <head>
      <script></script>
    </head>
    <body>
    </body>
  </body>
</html>

（在浏览器中右键单击页面并查看源代码自行查看，w3 -validate 如有必要）

在 innerfile.xhtml 中进行相应修复：

<ui:composition ... >
    <h:outputScript library="js" name="jquery-1.6.2.js" target="head" />
    <h:outputScript library="js" name="inner.js" target="head" />

    <h:panelGroup>
        I Am Text in The Inner File!
    </h:panelGroup>
</ui:composition>

这将生成有效的 HTML。由声明的脚本将自动出现在中（如果之前尚未声明）。就像在真正的 HTML 中一样，整个视图中应该只有一个和，包括任何模板和包含文件。

我需要（并且应该）在内部文件中再次声明公共（jquery-1.6.2.js）吗？

如果父文件已将其声明为。但在包含中重新声明它并没有什么坏处。如果之前已经声明过，则无论如何都不会重复。

如果我使用 Ajax 取消渲染并重新渲染 inner_panel 会发生什么？内部包含的标头会重新加载吗？

这仅在您不使用target="head"时才有效。它们是否会从服务器重新加载，取决于浏览器之前是否已经请求过它们并且已经存在于浏览器缓存中并且有效。但基本上，浏览器会再次被告知加载它，是的。使用 Firebug 您可以轻松确定它。

Is it okay to declare the js files in the inner file the way I did?

No. You should not specify the <h:head> in the include as well. This would only result in invalid HTML. As you have right now will result in:

<html>
  <head>
    <script></script>
  </head>
  <body>
    <head>
      <script></script>
    </head>
    <body>
    </body>
  </body>
</html>

(rightclick page in browser and do View Source to see it yourself, w3-validate if necessary)

Fix it accordingly in innerfile.xhtml:

<ui:composition ... >
    <h:outputScript library="js" name="jquery-1.6.2.js" target="head" />
    <h:outputScript library="js" name="inner.js" target="head" />

    <h:panelGroup>
        I Am Text in The Inner File!
    </h:panelGroup>
</ui:composition>

This will result in valid HTML. The scripts declared by <h:outputScript target="head"> will just end up in the <head> automatically, if not already declared before. Like as in real HTML, there should be only one <h:head> and <h:body> in the entire view, including any templates and include files.

Do I need (And Should I) declare the common (jquery-1.6.2.js) again in the inner file?

Not if the parent file has it already declared as <h:outputScript>. But redeclaring it in the include doesn't harm. It won't be duplicated anyway if it's already been declared before.

What happens if I un-render and the re-render inner_panel using Ajax? Will the inner-included headers be reloaded?

This only works if you don't use target="head". Whether they will be reloaded from the server, depends on whether it's already been requested by the browser before and already present and valid in the browser cache. But basically, the browser will be told again to load it, yes. With Firebug you can easily determine it.

回复收藏 0 原文

初懵 2024-12-14 19:19:45

正确的编写方法是在innerfile.xhtml 上的h:outputScript 声明中使用target="head" ：

<ui:composition ... >
    <h:outputScript library="js" target="head" name="jquery-1.6.2.js" />
    <h:outputScript library="js" target="head" name="inner.js" />
    <h:panelGroup>
       I Am Text in The Inner File!
    </h:panelGroup>
</ui:composition>

这样所有的资源声明都将被放入outer 中。具有相同库/资源名称的同一资源的多个声明不会多次渲染相同的声明，因为 h:outputScript 的渲染器有一些代码可以检测到这一点并忽略重复的条目。请注意，如果渲染不引用 javascript 文件的 ah:outputScript，情况会有所不同。

The right way to write it is use target="head" inside your h:outputScript declaration on innerfile.xhtml:

<ui:composition ... >
    <h:outputScript library="js" target="head" name="jquery-1.6.2.js" />
    <h:outputScript library="js" target="head" name="inner.js" />
    <h:panelGroup>
       I Am Text in The Inner File!
    </h:panelGroup>
</ui:composition>

In that way all your resource declarations will be put inside the outer . Multiple declarations of the same resource with the same library/resource name will not render the same declaration multiple times, because the renderer for h:outputScript has some code that detect that and ignore the duplicate entries. Note things are different if you render a h:outputScript that does not reference a javascript file.

回复收藏 0 原文

~没有更多了~