Demo/Übung PC-Liste: Hervorhebung II

Lernziel

Lösungen

zu folgenden Aufgaben wird hier eine Schritt für Schritt Anleitung gezeigt:

  1. Erstellen Sie eine neue Spalte, die den Status eines Rechners ausgibt.

  2. Geben Sie diesmal den Rechnern mit dem Status schulungrechner (HINWEIS: den Tippfehler beachten) die Farbe grün und allen anderen Rechnern die Hintergrundfarbe orange.

Handlungsanweisungen

Neue Aufgaben
Geben Sie die Farbe der Zeilen in der Tabelle im Wechsel mit
unterschiedlichen Farben aus.
Bild Peter
Zitat
Es gibt Dinge, die man bereut, ehe man sie tut.
Und man tut sie doch.” – Friedrich Hebbel

Lösung zu den Aufgaben:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output method="html"/>
<xsl:template match="/">

 <html>
    <head>
      <title>Rechneruebersicht</title>
      <link rel="stylesheet" type="text/css" href="formate.css"/>
    </head>
    <body>
    <h2>Die Liste aller Rechner</h2>
    <!--[weitere Regeln abarbeiten] -->
    <xsl:apply-templates />
    </body>
  </html>

</xsl:template>

<xsl:template match="pcliste/raum">
  <h3>
    <xsl:value-of select="@bezeichnung"/>
  </h3>

  <table border="0" class="kopf">
    <tbody>
    <tr>
      <th>Nummer</th>
      <th>Status</th>
      <th>Anmerkung</th>
      <th>Rechner</th>
      <th>IP</th>
    </tr>
    <!--[weitere Regeln abarbeiten] -->
    <xsl:apply-templates />
    </tbody>
  </table>

</xsl:template>

<xsl:template match="rechner">

    <xsl:if  test="anmerkung/@status='Schulungrechner'">
    <tr class="wichtig">
      <td><xsl:number format="I" count="rechner" /></td>
      <td>Schulungsrechner</td>
      <xsl:apply-templates />
    </tr>
    </xsl:if>
    <xsl:if test="anmerkung/@status!='Schulungrechner'">
    <tr class="schulungsrechner">
      <td><xsl:number format="I" count="rechner" /></td>
      <td><xsl:value-of select="anmerkung/@status" /></td>
      <xsl:apply-templates />
    </tr>
    </xsl:if>

</xsl:template>

<xsl:template match="anmerkung | rechnerip | rechnername">
      <td>
        <!--[Zugriff auf den Element-Inhalt] -->
     <xsl:value-of select="." />
      </td>
</xsl:template>

</xsl:stylesheet>

Im ersten Schritt legen wir für den Tabellenkopf eine neue Spalte an. Der Vergleichstest bezieht sich diesmal auf ein Attribut. Im ersten Fall, es handelt sich um einen Schulungsrechner, geben wir die Zeichenfolge „Schulungsrechner“ aus und verschleiern nach außen den kleinen Tippfehler.

Wenn das status-Attribut etwas anderes enthält, wollen wir sehen, was drinsteht und greifen deshalb auf den Attributinhalt zu.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
body
{
  background-color: #ffffff;
  color: #000000;
  font-family:arial;
}

h2{
  color:#0000ff;
}

h3{
  color:#00ff00;
}

table {
   border-width:2px;
   border-style:solid;
   border-color:gray;
}
.kopf {
  background-color:green;}

th {
  align:left;
}

td {
  border-width:2px;
  border-style:solid;
}

.wichtig{
  background-color:green;
}

.schulungsrechner {
  background-color:orange;
}