Prezentacja i transformacja

Podobne dokumenty
Prezentacja i transformacja

XML Path Language (XPath)

XPath XML Path Language. XPath. XSLT część 1. XPath data model. Wyrażenia XPath. Location paths. Osie (axes)

XPath XML Path Language. XPath. XSLT część 1. XPath data model. Wyrażenia XPath. Osie (axes) Location paths

Wprowadzenie do arkuszy stylistycznych XSL i transformacji XSLT

LABORATORIUM 5 WSTĘP DO SIECI TELEINFORMATYCZNYCH WPROWADZENIE DO XML I XSLT

Plan prezentacji. Krótko o XML Arkusze stylów XSLT XSL XSL Path Przegląd konstrukcji języka i przykłady Narzędzia Podsumowanie Literatura

Słowem wstępu. Część rodziny języków XSL. Standard: W3C XSLT razem XPath 1.0 XSLT Trwają prace nad XSLT 3.0

Kurs WWW Język XML, część II

XML extensible Markup Language. część 3

METAJĘZYKI. Politechnika Koszalińska Wydział Elektroniki i Informatyki Katedra Inżynierii Komputerowej

Ćwiczenia laboratoryjne nr 8 Podstawy języka XML.

Słowem wstępu. Standard: W3C XPath razem XSLT 1.0. XPath razem z XQuery 1.0 i XSLT 2.0. XPath trwają prace nad XPath 3.

Język XSLT. UEK w Krakowie Janusz Stal & Grażyna Paliwoda-Pękosz. UEK w Krakowie Janusz Stal & Grażyna Paliwoda-Pękosz

Przetwarzanie dokumentów XML i zaawansowane techniki WWW Wykład 04

Wprowadzenie do technologii XML

Języki formatowania dokumentów strukturalnych. XSL przekształcenia XML-a. XSL a XSLT. XSL części składowe. Zasada działania przekształcenia XSLT

Aplikacje internetowe laboratorium XML, DTD, XSL

XPath XML Path Language. XSL Extensible Stylesheet Language. Wyrażenia XPath. XPath data model. Location paths. Osie (axes)

Języki i Techniki Programowania II. Wykład 13. TRaX, Applety, Java Security

Przetwarzanie dokumentów XML i zaawansowane techniki WWW Przetwarzanie dokumentów XML za pomocą procesora XSLT (Zajęcia r.

29. Poprawność składniowa i strukturalna dokumentu XML

Służy do wybierania/wyszukiwania fragmentów dokumentu XML. Przypomina trochę ścieżki w systemie operacyjnym. Niech będzie dany dokument XML:

Prezentacja dokumentów XML

Podstawy (X)HTML i CSS

XML extensible Markup Language 3

Extensible Markup Language III

XML materiały dydaktyczne - Kurs Podstawowy XSL - wprowadzenie. XSL warstwa przekształcania (XSLT) oraz prezentacji informacji (XSL FO).

WYKŁAD 1 METAJĘZYK SGML CZĘŚĆ 1

Kaskadowe arkusze stylów (CSS)

Aplikacje internetowe laboratorium XML, DTD, XML Schema, XSL

PROGRAMOWANIE. WNPiD UAM, Programowanie, inż. Piotr Jabłoński

XSLT. Patryk Czarnik. Instytut Informatyki UW. XML i nowoczesne technologie zarzadzania treścia 2007/08

Aplikacje internetowe. Interfejs użytkownika

Dzięki arkuszom zewnętrznym uzyskujemy centralne sterowanie wyglądem serwisu. Zewnętrzny arkusz stylów to plik tekstowy z rozszerzeniem css.

Plan dzisiejszego wykładu. Narzędzia informatyczne w językoznawstwie. XML - Definicja. Zalety XML

XML extensible Markup Language. część 6

Wprowadzenie do XSLT

Przetwarzanie dokumentów XML za pomocą XSLT ( r.)

XSLT. Patryk Czarnik. XML i nowoczesne technologie zarzadzania treścia 2007/08

Rodzaje przetwarzania XSLT (1)

Elementarz HTML i CSS

XML i nowoczesne technologie zarządzania treścią

Języki XPath i XQuery

XQuery. XQuery. Przykład. dokument XML. XQuery (XML Query Language) XQuery 1.0: An XML Query Language. W3C Recommendation

Programowanie internetowe

DTD - encje ogólne i parametryczne, przestrzenie nazw

rk HTML 4 a 5 różnice

Prezentacja dokumentów XML

Elektroniczna wymiana danych (EDI) jest to: - wymiana informacji pomiędzy komputerami, z użyciem powszechnie akceptowanych standardów

Rola języka XML narzędziem

Dokument poprawnie sformułowany jest zgodny z ogólnymi zasadami składniowymi:

Tworzenie Stron Internetowych. odcinek 6

Wprowadzenie do standardu XSL

Wprowadzenie do HTML, CSS, JavaScript, PHP. Kurs

XSLT. Patryk Czarnik. XML i nowoczesne technologie zarządzania treścią 2008/09. Instytut Informatyki UW

Prezentacja dokumentów XML

XML i nowoczesne technologie zarządzania treścią

CSS. Kaskadowe Arkusze Stylów

Obiektowy model dokumentu. Katedra Mikroelektroniki i Technik Informatycznych

XML Schema. Bartłomiej Świercz. Łódź, 19 listopada 2005 roku. Katedra Mikroelektroniki i Technik Informatycznych. Bartłomiej Świercz XML Schema

Prezentacja dokumentów XML

XML i nowoczesne metody zarządzania treścią

Kurs HTML 4.01 TI 312[01]

XSLT. Patryk Czarnik. XML i nowoczesne technologie zarzadzania treścia 2008/09. Instytut Informatyki UW. Patryk Czarnik 08 XSLT XML 2008/09 1 / 1

Języki XPath i XQuery

XSLT. Patryk Czarnik. XML i nowoczesne technologie zarządzania treścią 2011/12

Kaskadowość stylów określa pierwszeństwo w oddziaływaniu na te same elementy strony różnych stylów.

Wykład 2 Składnia języka C# (cz. 1)

Front-end: solidne podstawy. Wszystko, co warto wiedzieć o HTML, CSS, JavaScript i Bootstrap.

Tworzenie Stron Internetowych. odcinek 6

Przykładowy dokument XML

Simple Object Access Protocol

Zakres treści Czas. 2 Określenie charakteru i tematyki strony. Rodzaje witryn. Projekt graficzny witryny. Opracowanie skryptów

Model semistrukturalny

Źródła. cript/1.5/reference/ Ruby on Rails: AJAX: ssays/archives/

Semistrukturalne bazy danych Wykład dla studentów matematyki

XML-RPC: Zdalne wykonywanie procedur

Po zakończeniu rozważań na temat World Wide Web, poznaniu zasad organizacji witryn WWW, przeczytaniu kilkudziesięciu stron i poznaniu wielu nowych

UCHWAŁA NR L/932/13 RADY MIASTA MYSŁOWICE. z dnia 19 grudnia 2013 r.

Narzędzia informatyczne w językoznawstwie

Języki XPath i XQuery

XML extensible Markup Language. część 8

Young Programmer: HTML+PHP. Dr inż. Małgorzata Janik, Zajęcia #2

2 Podstawy tworzenia stron internetowych

<body> <div style="max-width: 900px; margin: 0 auto;">

Wykład 5_2 Arkusze stylów dziedziczenie. Technologie internetowe Zofia Kruczkiewicz

KARTA KURSU. Przetwarzanie dokumentów XML i zaawansowane techniki WWW

Przykładowy dokument XML

Rok akademicki: 2013/2014 Kod: ZZIP IN-s Punkty ECTS: 2. Kierunek: Zarządzanie i Inżynieria Produkcji Specjalność: Informatyka w zarządzaniu

XML DTD XML Schema CSS

Technologie internetowe

Literatura. Głównie informacje w sieci:

1. Pierwszy program. Kompilator ignoruje komentarze; zadaniem komentarza jest bowiem wyjaśnienie programu człowiekowi.

I. Formatowanie tekstu i wygląd strony

Nazwa implementacji: CSS i box model. Autor: Opis implementacji: Poznajemy podstawy CSS oraz dowiadujemy się o rozmieszczaniu elementów na stronie.

XML extensible Markup Language. część 1

5-6. Struktura dokumentu html. 2 Określenie charakteru i tematyki strony. Rodzaje witryn. Projekt graficzny witryny. Opracowanie skryptów

Zaawansowany kurs języka Python

Język JAVA podstawy. wykład 2, część 1. Jacek Rumiński. Politechnika Gdańska, Inżynieria Biomedyczna

Transkrypt:

Prezentacja i transformacja Bartłomiej Świercz Katedra Mikroelektroniki i Technik Informatycznych Łódź, 11 kwietnia 2010

Prezentacja i transformacja CSS2a Ważną cechą dokumentów XML jest ich łatwa prezentacja do formy czytelnej dla człowieka oraz transformacja do innych dokumentów strukturalnych. Celem dzisiejszego wykładu jest omówienie dwóch technologii związanych z dokumentami XML: prezentacji na przykładzie CSS, transformacji na przykładzie.

Przykładowa aplikacja CSS2a Podczas wykładów przykładowe aplikacje będą dotyczyły obsługi wypożyczalni płyt DVD. Dane o dostępnych płytach będą zapisane w pliku XML, którego definicja DTD ma postać: Plik: wypożyczalnia.dtd <!ELEMENT katalog(dvd+) > <!ELEMENT dvd(tytul, aktorzy, sztuk) > <!ATTLIST dvd id CDATA#REQUIRED > <!ELEMENT tytul(#pcdata) > <!ELEMENT aktorzy(aktor+) > <!ELEMENT aktor(#pcdata) > <!ELEMENT sztuk(#pcdata) >

Przykładowa aplikacja CSS2a Plik: wypożyczalnia.xml <?xml version="1.0" encoding="iso-8859-2"?> <!DOCTYPE katalog SYSTEM"wypożyczalnia.dtd"> <katalog> <dvd id="1"> <tytul>rambo I</tytul> <aktorzy> <aktor>sylvester Stallone</aktor> </aktorzy> <sztuk>2</sztuk> </dvd>... </katalog>

Prezentacja za pomocą CSS CSS2a CotojestCSS? CSS jest skrótem od Cascading Style Sheetsh. Style określają w jaki sposób mają być wyświetlone poszczególne elementy dokumentu.

Prezentacja za pomocą CSS CSS2a CotojestCSS? CSS jest skrótem od Cascading Style Sheetsh. Style określają w jaki sposób mają być wyświetlone poszczególne elementy dokumentu. Style zostały dodane do HTML 4.0 w celu rozwiązania wielu problemów. Zewnętrzne style oszczędzają pracę programisty/grafika.

Cascading Style Sheets, Level 2 CSS2a Fragment dokumentu Technical Report CSS2 Specification: This specification defines Cascading Style Sheets, level2(css2).css2isastylesheetlanguagethatallows authors and users to attach style(e.g., fonts, spacing, and aural cues) to structured documents(e.g., HTML documents and XML applications). By separating the presentation style of documents from the content of documents, CSS2 simplifies Web authoring and site maintenance.

Style CSS2 a dokumenty XML CSS2a Style mogą być użyte z każdym dokumentem strukturalnym jakim jestxml.powodujeto,żexmljestbardziejzależnyodstyli niż HTML!

Właczanie CSS do dokumentu XML CSS2a Aby skojarzyć arkusz styli CSS z dokumentem XML należy do nagłówka(prologu) dokumenut dołączyć deklarację: <?xml:stylesheet type="text/css" href="style.css"?>

Element blokowy czy rozwijany? CSS2a W arkuszu CSS należy zdecydować, które elementy są blokowe (zakończone znakiem nowej linii), a które rozwijane w miejscu wystąpienia.

Element blokowy czy rozwijany? CSS2a W arkuszu CSS należy zdecydować, które elementy są blokowe (zakończone znakiem nowej linii), a które rozwijane w miejscu wystąpienia. katalog, dvd, tytul,\ aktorzy, sztuk{display: block} aktor{display: inline}

Przykład arkusza stylu CSS CSS2a Arkusz CSS: katalog{background-color:#ffffff; width=100%;} dvd{background-color:#aaaaaa; display: block; margin-bottom: 30pt;} tytul{display: block; color:#0000ff; font-size: 20pt;} aktorzy, sztuk{display: block; color:#000000; font-size: 14pt;} aktor{display: inline; font-style: italic;}

Cele projektowe styli CSS2 CSS2a Przyszła i wsteczna kompatybilność. Przeznaczone do dokumentów strukturalnych. Niezależność od platformy i urządzenia. Proste i łatwe nanoszenie zmian. Minimalizacja obciążenia łącza sieciowego.

Style CSS2 a transformacje CSS2a Style CSS2 Brak możliwości zmodyfikowania struktury dokumentu. Element może być skojarzony z pojedyńczym obiektem wizualnym. Prezentacja za pomocą jednego modelu wizualnego. Transformacja Zmiana struktury dokumentu. Element może być dowolnie grupowany. Transformacja do dowolnego modelu wizualnego.

Technologia Prezentacja i transformacja CSS2a jest technologią opartą o XML służącą do wyszukiwania informacji w dokumentach XML. służy do poruszania się po elementach i atrybutach dokumentu. jest główną częścią standardu W3C. Technologie XQuery i XPointer zostały również zaprojektowane jako wyrażenia. Zrozumienie jest niezbędne do zrozumienia zaawansowanych technologii XML.

Czym jest? Prezentacja i transformacja CSS2a jest składnią służącą do definiowania części dokumentu XML. używa opisu ścieżek do nawigowania po dokumencie XML. zawiera wbudowaną bibliotekę standardowych funkcji. jest głównym elementem. jest standardem W3C.

używaopisu ścieżek... CSS2a używa wyrażeń w postaci ścieżek do wybierania węzła lub grupy węzłów w dokumencie XML. Wyrażenia te( ścieżki ) wyglądają jak tradycyjne odwołania do plików w systemie komputerowym.

Standardowe funkcje CSS2a zawiera ponad sto wbudowanych funkcji. Funkcje te służą do manipulacji ciągami znaków, wartości numerycznych, porównywania daty i czasu, operacji na węzłach dokumentu oraz dostarcza funkcji do obsługi wartości logicznych.

Terminologia Prezentacja i transformacja CSS2a rozróżnia siedem typów węzłów: Element. Atrybut. Tekst. Przestrzeń nazw. Instrukcję przetwarzania. Komentarz. Węzeł dokumentu.

Przykład Prezentacja i transformacja CSS2a Plik: wypożyczalnia.xml <?xml version="1.0" encoding="iso-8859-2"?> <!DOCTYPE katalog SYSTEM"wypożyczalnia.dtd"> <katalog> <dvd id="1"> <tytul>rambo I</tytul> <aktorzy> <aktor>sylvester Stallone</aktor> </aktorzy> <sztuk>2</sztuk> </dvd>... </katalog>

Przykład Prezentacja i transformacja CSS2a Typy węzłów: <katalog> węzeł dokumentu(root). <tytul> węzeł element. id węzeł atrybut.

Relacje pomiędzy węzłami CSS2a Rodzic każdy element i atrybut ma jednego przodka. Dziecko każdy element ma zero lub więcej dzieci. Rodzeństwo węzły które mają tego samego rodzica. Przodek rodzic, rodzic rodzica, itd. Potomek dziecko, dziecko dziecka, itd.

Wybieranie węzła(węzłów) CSS2a używa pojęcia ścieżki do określenia węzła lub grypy węzłów zgodnie z poniższymi regułami: Wyrażenie Znaczenie nazwa węzła Wybierz wszystkie dzieci węzła. / Wybierz węzeł root. // Wybierz węzły od aktualnego położenia pasujące do wyrażenia, nie ważne gdzie się znajdują.. Aktualny węzeł... Wybierz rodzica aktualnego węzła. @ Wybierz atrybut.

Wybieranie węzła- przykłady CSS2a Wyrażenie Znaczenie katalog Wybierz wszystkie węzły dzieci węzła katalog. /katalog Wybierz węzeł root katalog. katalog/dvd Wybierz wszystkie węzły dvd, które są dziećmi węzła katalog //dvd Wybierz wszystkie węzły dvd, nie ważne gdzie się znajdują. //@id Wybierz wszystkie atrybuty id.

Szczegółowe określanie węzła CSS2a posiada dodatkową konstrukcję pozwalającą na określenie konkretnego węzła lub jego wartości: //katalog/dvd[1] //katalog/dvd[last()] //katalog/dvd[position()<3] //dvd[@id] //dvd[@id= 1 ] //dvd[sztuk>3]

Oznaczanie nieznanych węzłów CSS2a Symbol Znaczenie * Pasuje do każdego węzła. *@ Pasuje do każdego atrybutu. node() Pasuje do węzła dowolnego typu. Dodatkowo można użyć operatora w celu wybrania kilku ścieżek(and).

Ścieżka lokalizacji Prezentacja i transformacja CSS2a Pełna forma ścieżki lokalizacji składa się z jednego lub więcej kroków lokalizacji oddzielonych od siebie znakami / lub //. Krok lokalizacji składa się z: osi(ang. axis), badania węzła, predykatów. Przykład pełnej ścieżki lokalizacji: child::/katalog/dvd[@id< 2]

Axes- osie kroków lokalizacji CSS2a Oś Znaczenie ancestor Wybierz wszystkich przodków aktualnego węzła. ancestor-or-self Wybierz wszystkich przodków oraz aktualny węzeł. attribute Wybierz wszystkie atrybuty aktualnego węzła. child Wybierz wszystkie dzieci aktualnego węzła. Jest to domyślna oś dla. descendant Wybierz wszystkich potomków aktualnego węzła. descendant-or-self Wybierz wszystkich potomków aktualnego węzła i aktualny węzeł.

Axes- osie kroków lokalizacji CSS2a Oś Znaczenie following Wybierz wszystko co jest w dokumencie z znacznikiem zamknięcia aktualnego węzła. following-sibling Wybierz rodzeństwo za aktualnym węzłem. namespace Wybierz wszystkie przestrzenie nazw aktualnego węzła. parent Wybierz przodka aktualnego węzła. preceding Wybierz wszystko co znajduje się w dokumencie przed aktualnym węzłem. preceding-sibling Wybierz rodzeństwo przed aktualnym węzłem. self Wybierz siebie.

Predykaty Prezentacja i transformacja CSS2a Predykaty są to wyrażenia w skład których wchodzą wywołania funkcji jak i operatory logiczne oraz arytmetyczne. Predykaty umieszczane są w między nawiasami[...]. Wyrażenia arytmetyczne w wykonywane są na liczbach zmiennoprzecinkowych podwójnej precyzji i nawet liczby całkowite są przechowywane jako liczby zmiennoprzecinkowe. Listę funkcji jak i ich opis można sprawdzić w specyfikacji: http://www.w3.org/tr/xpath20/ lub sekcji portalu Mozilla Developer Center: https://developer.mozilla.org/pl/

Skrócony zapis ścieżki lokalizacji CSS2a ścieżka Skrócony zapis self::node(). parent::node().. child::element_dziecko element_dziecko attribute::element_dziecko @element_dziecko descendant::* //* element_dziecko[position()=1] element_dziecko[1] dziecko[position()=last()] dziecko[last()]

Przykład: i Python CSS2a Skrypt Pythona odnajdujący zadany węzeł: import libxml2 doc = libxml2.parsefile("wypożyczalnia.xml") path=doc.xpatheval("//dvd") for element in path: print element.content

Wstęp Prezentacja i transformacja CSS2a Początkowo W3C chciało zaprojektować język XSL(EXtensible Stylesheet Language) ponieważ istniało zapotrzebowanie na XML owy odpowiednik arkusza styli. W ramach XSL powstały technologie: język do transformacji dokumentów XML. język do nawigacji po dokumentach XML. XSL-FO język do formatowania dokumentów XML.

Prezentacja i transformacja CSS2a został zainspirowany językami funkcjonalnymi oraz językami przetwarzającymi ciągi znaków i dopasowujących wzorce. Podobnie jak za poprzednika XML uważa się SGML, tak poprzednikiem był DSSSL służący do transformacji dokumentów SGML. najprościej jest sobie wyobrazić jako odpowiednik języka SQL dla dokumentów XML.

Czym jest? Prezentacja i transformacja CSS2a oznacza XSL Transformations. jest najważniejszą częścią XSL. służy do transformacji dokumentu XML w dowolny inny dokument. używa do nawigacji po dokumentach XML. jest rekomendowany przez W3C.

Czym jest? Prezentacja i transformacja CSS2a oznacza XSL Transformations. jest najważniejszą częścią XSL. służy do transformacji dokumentu XML w dowolny inny dokument. używa do nawigacji po dokumentach XML. jest rekomendowany przez W3C. Najczęściej mówi się, że przekształca drzewo źródłowe XML w drzewo wyników XML.

Preambuła Prezentacja i transformacja CSS2a Każdy dokument stylu musi zawierać w nagłówku: <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/xsl/transform"> lub <xsl:transform version="1.0" xmlns:xsl="http://www.w3.org/1999/xsl/transform"> Obydwie deklaracje przestrzeni nazw są synonimami. Aktualna wersja specyfikacji opracowana przez W3C definiuje język w wersji 2.0.

CSS2a Włączanie arkusza stylu XSL do XML Aby dołączyć arkusz stylu XSL(transformację ) należy w nagłówku dokumentu XML dopisać: <?xml-stylesheet type="text/xsl" href="wypożyczalnia.xsl"?>

Struktura na przykładzie CSS2a Plik wypożyczalnia.xsl: <?xml version="1.0" encoding="iso-8859-2"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/xsl/transform"> <xsl:template match="/"> <html> <body> <h1>wypożyczalnia DVD:</h1> <h2>tytuł: </h2> <h3>aktor: </h3> </body> </html> </xsl:template> </xsl:stylesheet>

Struktura na przykładzie CSS2a Plik wypożyczalnia.xsl: <xsl:template match="/katalog/dvd"> <html> <body> <h1>wypożyczalnia DVD:</h1> <h2>tytuł: <xsl:value-of select="tytul"/>h2> <h3>aktor: <xsl:value-of select="aktorzy"/></h3> </body> </html> </xsl:template>

Struktura na przykładzie CSS2a Plik wypożyczalnia.xsl: <xsl:template match="/"> <html> <body> <h1>wypożyczalnia DVD:</h1> <xsl:for-each select="katalog/dvd"> <h2>tytuł: <xsl:value-of select="tytul"/>h2> <h3>aktor: <xsl:value-of select="aktorzy"/></h3> </xsl:for-each> </body> </html> </xsl:template>

Dodatkowe instrukcje CSS2a Oprócz pokazanych na przykładzie instrukcji możliwe jest umieszczenie w arkuszu dodatkowych instrukcji sterujących: <xsl:sort select="tytul"/>

Dodatkowe instrukcje CSS2a Oprócz pokazanych na przykładzie instrukcji możliwe jest umieszczenie w arkuszu dodatkowych instrukcji sterujących: <xsl:sort select="tytul"/> <xsl:if test="sztuk> 10"> </xsl:if>

Dodatkowe instrukcje CSS2a Oprócz pokazanych na przykładzie instrukcji możliwe jest umieszczenie w arkuszu dodatkowych instrukcji sterujących: <xsl:sort select="tytul"/> <xsl:if test="sztuk> 10"> </xsl:if> <xsl:choose> <xsl:when test="sztuk> 10">... </xsl:when> <xsl:otherwise>... </xsl:otherwise> </xsl:choose>

Sterowanie strumieniem wyjściowym CSS2a <xsl:output method ="xml" "html" "text" qname-but-not-ncname version = nmtoken encoding = string omit-xml-declaration ="yes" "no" standalone ="yes" "no" doctype-public = string doctype-system = string cdata-section-elements = qnames indent="yes" "no" media-type = string/>

jako język programowania CSS2a pomimotego,żesamwsobiejestdokumentemxmlstał się pełnoprawnym językiem programowania zaliczanym do grupy języków deklaratywnych. Poza wykorzystaniem prostych instrukcji blokowych pozwala na definiowanie funkcji(dopasowań), parametryzowanie funkcji, definicję zmiennych itd. Dzięki temu możliwe jest zaprogramowanie w dowolnego algorytmu: Gallery of Stupid XSL and Tricks: http://incrementaldevelopment.com/xsltrick/ 99BottlesofBeerin http://99-bottles-of-beer.net/language-xslt-76.html

Nauka Prezentacja i transformacja CSS2a Doskonałym, praktycznym przewodnikiem po jest Reference: http://www.zvon.org/xxl/reference/output/index.html