2011-10-02 13 views
5

będę ilustrate moje pytanie na przykładzie:Dołącz pliki JS w pliku XHTML, która została uwzględniona przy użyciu ui: include

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> 

Moje pytania:

  1. Czy można anulować Czy pliki wewnętrzne w pliku wewnętrznym znajdują się tak samo jak ja?
  2. Czy muszę (i powinienem) zadeklarować wspólny (jquery-1.6.2.js) ponownie w wewnętrznym pliku?
  3. Co się stanie, jeśli wyłączysz renderowanie i ponownie wygeneruje inner_panel używając AJAX? Czy przeładowane zostaną wewnętrzne nagłówki?

Odpowiedz

12

Czy mogę zadeklarować pliki JS w pliku wewnętrzną drogą zrobiłem?

Nie. Nie należy również podawać <h:head> w załącznikach. Doprowadziłoby to tylko do unieważnienia kodu . Jak masz teraz spowoduje:

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

(stronie kliknij prawym przyciskiem myszy w przeglądarce i nie View Source to zobaczyć samemu, w3-validate jeśli to konieczne)

go naprawić odpowiednio w 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> 

Doprowadzi to do poprawnego HTML. Skrypty zadeklarowane przez <h:outputScript target="head"> będą automatycznie trafiać do <head>, jeśli nie zostały wcześniej zadeklarowane. Podobnie jak w prawdziwym HTML, w całym widoku powinien znajdować się tylko i <h:body>, w tym wszelkie szablony i pliki dołączane.


Czy muszę (i powinien I) deklarują wspólną (jQuery 1.6.2.js) ponownie w pliku wewnętrznej?

Nie, jeśli plik nadrzędny ma już zadeklarowany jako <h:outputScript>. Ale redeclaring go w tym nie szkodzi. Nie będzie to jednak duplikowane, jeśli zostało już zadeklarowane wcześniej.


Co się stanie, jeśli nie-renderowanie i ponowne renderowanie inner_panel użyciem Ajax? Czy przeładowane zostaną wewnętrzne nagłówki?

Działa to tylko, jeśli nie używasz target="head".To, czy zostaną one załadowane ponownie z serwera, zależy od tego, czy przeglądarka już wcześniej zażądała i czy jest już obecna i jest ważna w pamięci podręcznej przeglądarki. Ale zasadniczo, przeglądarka zostanie ponownie poinformowana, aby ją załadować, tak. Z Firebug możesz to łatwo określić.

+0

Tnx. Małe śledzenie - zgodnie z twoją odpowiedzią, jeśli załaduję stronę, gdy ta strona wewnętrzna nie zostanie wyrenderowana, a następnie wyrenderuję stronę wewnętrzną, wewnętrzne pliki js zostaną utracone. Dobrze? – Ben

+0

Nie powiedziałem tego. Zostaną uwzględnione. Przeglądarka zostanie poinformowana, aby je załadować. Ale to, czy zostało uzyskane z pamięci podręcznej przeglądarki, czy bezpośrednio z serwera, zależy od nagłówków odpowiedzi JS i czy jest już w pamięci podręcznej przeglądarki, czy nie. Jeśli jest buforowany i obecny w pamięci podręcznej przeglądarki, to nie zostanie ponownie załadowany (ponieważ przeglądarka już go posiada). W przeciwnym razie zostanie on ponownie załadowany z serwera. – BalusC

+0

Widzę twoją sprawę, wyjaśniłem część ponownego renderowania. – BalusC

1

Właściwy sposób, aby ją napisać, to użyć target = „głowę” wewnątrz godz: deklaracja outputScript na 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> 

W ten sposób wszystkie deklaracje zasobu będzie umieścić wewnątrz zewnętrznej. Wielokrotne deklaracje tego samego zasobu o tej samej nazwie biblioteki/zasobu nie będą wielokrotnie renderować tej samej deklaracji, ponieważ mechanizm renderujący dla h: outputScript ma kod, który wykrywa to i ignoruje duplikaty wpisów. Uwaga: rzeczy są różne, jeśli renderujesz h: wynikowy, który nie odwołuje się do pliku javascript.

Powiązane problemy