Ptaszor i jego blog! Lol…

Do wszystkich elementów języka XUL możemy dodać elementy języka HTML. Dzięki umieszczeniu elementów HTML wewnątrz XUL-a, mamy możliwość dodawania na przykład apletów Javy. Pomimo możliwości umieszczania tych elementów, należy jak najrzadziej to czynić.
Pierwszym ważnym krokiem ku zagnieżdżaniu HTML-a w naszych przykładach jest to, że umieszczane elementy muszą zawsze być pisane z małej litery, tak jak w XML-u.

Chcąc stosować elementy języka HTML w pliku XUL, musimy zadeklarować, że chcemy tego dokonać. Aby to uczynić stosujemy przestrzeń nazw XHTML. Poniższy fragment kodu powinien zostać dodany do atrybutu elementu window:

xmlns:html="http://www.w3.org/1999/xhtml"

Poniżej przykład zastosowania przestrzeni nazw w jakimś konkretnym przykładzie:

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<window
   id="identyfikator-okna"
   title="tytuł"
   orient="horizontal"
  xmlns:html="http://www.w3.org/1999/xhtml"
   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

Elementy języka HTML możemy stosować według następujących kilku reguł:

• Należy dodawać do każdego znacznika prefiks html:.
• Stosować powyżej omówioną przestrzeń nazw.
• Znaczniki muszą być pisane z małej litery.
• Do wszystkich atrybutów, należy stosować cudzysłowy.
• Do elementów bez znacznika kończącego, należy stosować zamykający znacznik /.

Przykład zastosowania elementów HTML:

<html:img src="obrazek.jpg"/>

<html:input type="checkbox" value="true"/>

<html:table>
  <html:tr>
    <html:td>
      Tabela
    </html:td>
  </html:tr>
</html:table>

W XUL-u zostały zagnieżdżone; obrazek, pole wyboru i tabela z jedną komórką. Zwróćcie uwagę na zastosowanie slasha (/) w obrazku oraz w polu wyboru. Jeśli opuścimy część html: przeglądarka pomyśli, że element był elementem XUL i nie będą wyświetlone, ponieważ elementy img, input oraz table nie są poprawnymi znacznikami XUL.

Użyjmy poznanych do tej pory wiadomości:

<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

<window id="przykladowe-okno" title="Przykład HTML-a w XUL-u"
        xmlns:html="http://www.w3.org/1999/xhtml"
        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<html:p>
  Tekst w znaczniku p:
  <html:input id="tekst"/>
  <button id="przycisk" label="OK"/>
</html:p>

</window>

Co wyświetli nam:

Tekst został wyświetlony ponieważ został poprawnie użyty znacznik p. Natomiast jeśli byśmy chcieli umieścić tekst poza znacznikiem, to nie zostałby on w ogóle wyświetlony.

Dodatkowo podam jeszcze trzy przypadki w jakich nie zostanie poprawnie zinterpretowany HTML w XUL-u:

<html:po>Przypadek 1</html:po>
<div>Przypadek 2</div>
<html:description value="Przypadek 3"/>

• Przypadek 1 – po nie jest poprawnym znacznikiem HTML-a, a przeglądarka nie wie jak odczytać ten znacznik.
• Przypadek 2 – div jest poprawny, ale tylko w HTML-u. Aby działał i tu, musimy dodać prefiks html:.
• Przypadek 3 – Element description jest poprawny tylko w XUL-u, a nie w HTML-u. Nie powinniśmy dodawać prefiksu html: przed tym elementem.

To tyle, więcej jak zwykle w kursie i dokumentacji XUL.