• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

HTML Tabelle geschickter bauen und Excel Export

apfelkraft.ch

Neues Mitglied
Ich habe hier einen kleinen Ausschnitt aus einer Tabelle, von denen gibt es zig auf einer einzigen HTML Seite und diese sind auch alle Unterschiedlich wie man sich vorstellen kann ist eine solche Seite schnell 500KB gross und es braucht dementsprechend lange bis diese aufgebaut wird. Nun wäre das Ziel den Code zu optimieren zum einen kann man wohl CLASS=TXTCBLK auch CLASS=T oder so schreiben was schon einiges bringt, aber gibt es eine auch eine Möglichkeit für einen "Block" ein Class Element zu definieren?

Ausserdem gibt es auf dieser Page, bzw. bei jeder Tabelle bisher einen ActiveX Button, mit einem Klick wird dann die entsprechende Tabelle in Excel geöffnet, natürlich ohne Formatierung was aber auch nicht stört. Ist sowas überhaupt möglich mit JS oder HTML 5?!? Oder bleibt hier nur der Weg via Sctive X, denn es handelt sich um Statische Pages und das kann man soweit auch nicht ändern, aber man könnte anderen Code beim generieren einpflegen....

HTML:
<TR>
<TD CLASS=HD2>SERIAL NUMBER</TD>
<TD CLASS=HD2>TYPE</TD>
<TD CLASS=HD2>MODEL</TD>
<TD CLASS=HD2>HW</TD>
<TD CLASS=HD2>MIPS</TD>
<TD CLASS=HD2>MSU</TD>
<TD CLASS=HD2>CPUS</TD>
<TD CLASS=HD2>ICFS</TD>
<TD CLASS=HD2>AAPS</TD>
<TD CLASS=HD2>IIPS</TD>
<TD CLASS=HD2>IFLS</TD>
<TD CLASS=HD2>CRYPTO COP</TD>
<TD CLASS=HD2>CRYPTO ACC</TD>
<TD CLASS=HD2>CENTRAL STORAGE</TD>
<TD CLASS=HD2>NUMBER OF CHANNELS</TD>

</THEAD>
<TBODY>
<TR onClick="HighLightTR(this)">
<TD CLASS= TITLE="SERIAL NUMBER">60E2 </TD>
<TD CLASS=TXTCBLK TITLE="TYPE">2097 </TD>
<TD CLASS=TXTCBLK TITLE="MODEL">713 </TD>
<TD CLASS=TXTCBLK TITLE="HW">E56 </TD>
<TD CLASS=TXTCBLK TITLE="MIPS">8.757,0 </TD>
<TD CLASS=TXTCBLK TITLE="MSU">1.075,9 </TD>
<TD CLASS=TXTCBLK TITLE="CPUS">13 </TD>
<TD CLASS=TXTCBLK TITLE="ICFS">6 </TD>
<TD CLASS=TXTCBLK TITLE="AAPS">0 </TD>
<TD CLASS=TXTCBLK TITLE="IIPS">0 </TD>
<TD CLASS=TXTCBLK TITLE="IFLS">0 </TD>
<TD CLASS=TXTCBLK TITLE="CRYPTO COP">4 </TD>
<TD CLASS=TXTCBLK TITLE="CRYPTO ACC"> . </TD>
<TD CLASS=TXTCBLK TITLE="CENTRAL STORAGE">141733920768 </TD>
<TD CLASS=TXTCBLK TITLE="NUMBER OF CHANNELS">108 </TD>

<TR onClick="HighLightTR(this)">
<TD CLASS=TXTCBLK TITLE="SERIAL NUMBER">60F2 </TD>
<TD CLASS=TXTCBLK TITLE="TYPE">2097 </TD>
<TD CLASS=TXTCBLK TITLE="MODEL">713 </TD>
<TD CLASS=TXTCBLK TITLE="HW">E56 </TD>
<TD CLASS=TXTCBLK TITLE="MIPS">8.757,0 </TD>
<TD CLASS=TXTCBLK TITLE="MSU">1.075,9 </TD>
<TD CLASS=TXTCBLK TITLE="CPUS">13 </TD>
<TD CLASS=TXTCBLK TITLE="ICFS">6 </TD>
<TD CLASS=TXTCBLK TITLE="AAPS">0 </TD>
<TD CLASS=TXTCBLK TITLE="IIPS">0 </TD>
<TD CLASS=TXTCBLK TITLE="IFLS">0 </TD>
<TD CLASS=TXTCBLK TITLE="CRYPTO COP">4 </TD>
<TD CLASS=TXTCBLK TITLE="CRYPTO ACC"> . </TD>
<TD CLASS=TXTCBLK TITLE="CENTRAL STORAGE">141733920768 </TD>
<TD CLASS=TXTCBLK TITLE="NUMBER OF CHANNELS">100 </TD>

<TR onClick="HighLightTR(this)">
<TD CLASS=TXTCBLK TITLE="SERIAL NUMBER">61A2 </TD>
<TD CLASS=TXTCBLK TITLE="TYPE">2097 </TD>
<TD CLASS=TXTCBLK TITLE="MODEL">713 </TD>
<TD CLASS=TXTCBLK TITLE="HW">E56 </TD>
<TD CLASS=TXTCBLK TITLE="MIPS">8.757,0 </TD>
<TD CLASS=TXTCBLK TITLE="MSU">1.075,9 </TD>
<TD CLASS=TXTCBLK TITLE="CPUS">13 </TD>
<TD CLASS=TXTCBLK TITLE="ICFS">0 </TD>
<TD CLASS=TXTCBLK TITLE="AAPS">0 </TD>
<TD CLASS=TXTCBLK TITLE="IIPS">0 </TD>
<TD CLASS=TXTCBLK TITLE="IFLS">0 </TD>
<TD CLASS=TXTCBLK TITLE="CRYPTO COP">4 </TD>
<TD CLASS=TXTCBLK TITLE="CRYPTO ACC"> . </TD>
<TD CLASS=TXTCBLK TITLE="CENTRAL STORAGE">137438953472 </TD>
<TD CLASS=TXTCBLK TITLE="NUMBER OF CHANNELS">96 </TD>

<TR onClick="HighLightTR(this)">
<TD CLASS=TXTCBLK TITLE="SERIAL NUMBER">61B2 </TD>
<TD CLASS=TXTCBLK TITLE="TYPE">2097 </TD>
<TD CLASS=TXTCBLK TITLE="MODEL">713 </TD>
<TD CLASS=TXTCBLK TITLE="HW">E56 </TD>
<TD CLASS=TXTCBLK TITLE="MIPS">8.757,0 </TD>
<TD CLASS=TXTCBLK TITLE="MSU">1.075,9 </TD>
<TD CLASS=TXTCBLK TITLE="CPUS">13 </TD>
<TD CLASS=TXTCBLK TITLE="ICFS">0 </TD>
<TD CLASS=TXTCBLK TITLE="AAPS">0 </TD>
<TD CLASS=TXTCBLK TITLE="IIPS">0 </TD>
<TD CLASS=TXTCBLK TITLE="IFLS">0 </TD>
<TD CLASS=TXTCBLK TITLE="CRYPTO COP">4 </TD>
<TD CLASS=TXTCBLK TITLE="CRYPTO ACC"> . </TD>
<TD CLASS=TXTCBLK TITLE="CENTRAL STORAGE">137438953472 </TD>
<TD CLASS=TXTCBLK TITLE="NUMBER OF CHANNELS">98 </TD>

<TR onClick="HighLightTR(this)">
<TD CLASS=TXTCBLK TITLE="SERIAL NUMBER">71B2 </TD>
<TD CLASS=TXTCBLK TITLE="TYPE">2097 </TD>
<TD CLASS=TXTCBLK TITLE="MODEL">713 </TD>
<TD CLASS=TXTCBLK TITLE="HW">E56 </TD>
<TD CLASS=TXTCBLK TITLE="MIPS">8.757,0 </TD>
<TD CLASS=TXTCBLK TITLE="MSU">1.075,9 </TD>
<TD CLASS=TXTCBLK TITLE="CPUS">13 </TD>
<TD CLASS=TXTCBLK TITLE="ICFS">0 </TD>
<TD CLASS=TXTCBLK TITLE="AAPS">0 </TD>
<TD CLASS=TXTCBLK TITLE="IIPS">0 </TD>
<TD CLASS=TXTCBLK TITLE="IFLS">0 </TD>
<TD CLASS=TXTCBLK TITLE="CRYPTO COP">4 </TD>
<TD CLASS=TXTCBLK TITLE="CRYPTO ACC"> . </TD>
<TD CLASS=TXTCBLK TITLE="CENTRAL STORAGE">137438953472 </TD>
<TD CLASS=TXTCBLK TITLE="NUMBER OF CHANNELS">96 </TD>

<TR onClick="HighLightTR(this)">
<TD CLASS=TXTCBLK TITLE="SERIAL NUMBER">71C2 </TD>
<TD CLASS=TXTCBLK TITLE="TYPE">2097 </TD>
<TD CLASS=TXTCBLK TITLE="MODEL">713 </TD>
<TD CLASS=TXTCBLK TITLE="HW">E56 </TD>
<TD CLASS=TXTCBLK TITLE="MIPS">8.757,0 </TD>
<TD CLASS=TXTCBLK TITLE="MSU">1.075,9 </TD>
<TD CLASS=TXTCBLK TITLE="CPUS">13 </TD>
<TD CLASS=TXTCBLK TITLE="ICFS">0 </TD>
<TD CLASS=TXTCBLK TITLE="AAPS">0 </TD>
<TD CLASS=TXTCBLK TITLE="IIPS">0 </TD>
<TD CLASS=TXTCBLK TITLE="IFLS">0 </TD>
<TD CLASS=TXTCBLK TITLE="CRYPTO COP">4 </TD>
<TD CLASS=TXTCBLK TITLE="CRYPTO ACC"> . </TD>
<TD CLASS=TXTCBLK TITLE="CENTRAL STORAGE">137438953472 </TD>
<TD CLASS=TXTCBLK TITLE="NUMBER OF CHANNELS">99 </TD> </TD>
 
Tabellen bestehen aus etlichen HTML-Tags. Die kann man nicht optimieren. Tabellen brauchen halt viel Code. Aber da es sich hier bei Dir - so wie ich das sehe - auch um tabellarische Daten handelt, sind Tabellen die einzig richtige Auszeichnung.

Du könntest die Tabelle höchstens auf mehrere Seite aufteilen, dann wird weniger geladen und weniger dargestellt.

Wenn es Dir um die Übersicht im Quellcode geht, dann könntest Du den Seitencode auch serverseitig (z.B. mit PHP) erzeugen lassen. Die Daten könnten ja z.B: auch aus einer Datenbank kommen. Am Ende kommt aber auf jeden Fall wieder der gleiche, lange Code raus, den der Browser aber auch braucht, um ihn darzustellen.

Klassen kannst Du für jedes Tag definieren, und über geschickte Selektoren kannst Du Dir die Angabe von Klassen u.U. auch sparen.

Wenn Du z.B. alle <td> in einer bestimmten Tabelle ansprechen willst, musst Du nicht jedem <td> eine Klasse zuweisen, sondern dann gibst Du der Tabelle eine ID und sagst im Stylesheet:
Code:
table#bestimmteTabelle td {
  ...
}
Das setzt die Eigenschaften für alle <td> die innerhalb einer <table id="bestimmteTabelle"> stehen fest. Auf die Weise kann man oft vieles verkürzen.

Das mit dem Öffnen in Excel versteh ich gerade nicht ganz. Du kannst immer auf ein Excel-Dokument mit einem einfachen Anker verlinken (<a href="dokument.xls">Zum Excel-Dokument<a>). Ob das Dokument dann im Browser angezeigt wird, oder ob es überhaupt angezeigt wird, liegt natürlich an der installierten Software.

Mit ActiveX kenne ich mich nicht aus.
 
Hallo, vielen Dank für die Antwort!

Also wenn alle TD z.bsp. denselben Wert haben kann ich das angeben, das spart mir schonmal einiges an KBs, denn ich kann die Seiten weder kürzen noch wirklich gross verändern...ich würde sowas ansich mit einer DB und PHP oder sowas aufbauen, aber diese "Macht" habe ich in diesem Fall nicht, somit bringt das mit dem CSS-Typ sicherlich schon mal etwas.

Das andere was ansich noch wichtiger ist, die Tabellen sind wie gesagt statisch und weisen zur Zeit einen Button auf "Export to Excel", klickt man auf diesen exportiert ein ActiveX die Daten nach Excel. Das funktioniert ist aber hier nicht mehr "legal", sprich muss anders gelöst werden. Mit einer DB usw. wäre das einfach, aber das soll es wie gesagt nicht sein und Rechtsklick "Export to Excel" geht schon exportiert aber immer alle Tabelle und das ist auch nicht gewünscht, es soll nur die eben markierte Tabelle der vielleicht 10 auf dem Screen exportieren....die Frage ist nur wie man sowas machen könnte eben ohne ActiveX??
 
Ich kenne ActiveX nicht, daher weiß ich nicht, was da im Hintergrund abläuft. Unter "konvertieren" verstehe ich, dass die Tabelle vom HTML-Format ins Excel-Format umgewandelt wird.
Aber clientseitig so eine Arbeit verrichten...? Kann ich mir nur sehr schwer vorstellen, wie das gehen soll. ActiveX macht ja schon immer etwas mehr clientseitig, als vielen lieb ist.
 
Zurück
Oben