Tabellenbezogene Anordnung und Javascript-Operationen table, tr, td

Tabellenbezogene Anordnung und Javascript-Operationen table, tr, td
Gut funktionierende Einstellungen für Tabelleneigenschaften:

Code kopieren
Der Code lautet wie folgt:

<table cellSpacing="0" cellPadding="0" border='1' bordercolor="schwarz"
Stil='border-collapse:collapse;table-layout: fest'></table>

Viele Leute haben diese Erfahrung gemacht: Wenn in einem TD kein Inhalt oder keine sichtbaren Elemente vorhanden sind, verschwindet auch der Rand des TD. Die Lösung besteht darin, der Tabelle den Stil border-collapse:collapse hinzuzufügen.
Allgemeine Textkürzung (gilt sowohl für Inline- als auch für Blocktext):

Code kopieren
Der Code lautet wie folgt:

.text-overflow{
display:block;/*Inline-Objekte müssen hinzugefügt werden*/
Breite: 31em;
Wortumbruch:alles behalten;/* Kein Zeilenumbruch*/
white-space:nowrap;/* Kein Zeilenumbruch*/
overflow:hidden;/*Überschüssigen Inhalt ausblenden, wenn der Inhalt die Breite überschreitet*/
text-overflow:ellipsis; /* Zeigt ein Auslassungszeichen (...) an, wenn der Text innerhalb eines Objekts überläuft; muss zusammen mit overflow:hidden; verwendet werden. */
}

Bei Tabellen ist die Definition etwas anders:

Code kopieren
Der Code lautet wie folgt:

Tisch{
Breite: 30em;
table-layout:fixed;/* Die folgende td-Definition funktioniert nur, wenn der Tabellenlayout-Algorithmus als fest definiert ist. */
}
td{
Breite: 100 %;
Wortumbruch:alles behalten;/* Kein Zeilenumbruch*/
white-space:nowrap;/* Kein Zeilenumbruch*/
overflow:hidden;/*Überschüssigen Inhalt ausblenden, wenn der Inhalt die Breite überschreitet*/
text-overflow:ellipsis; /* Zeigt ein Auslassungszeichen (...) an, wenn der Text innerhalb eines Objekts überläuft; muss zusammen mit overflow:hidden; verwendet werden. */
}

Javascript-Operationstabelle, tr, td

Code kopieren
Der Code lautet wie folgt:

table.moveRow(m,n) //Vertausche die Zeilen der Tabelle (IE) Die Zeilen zwischen m und n werden der Reihe nach verschoben
table.deleteRow(index) // Zeile löschen
table.insertRow(index) //Fügt eine Zeile bei Index ein und gibt den TR zurück
tr.insertCell(index) //Fügt eine Zelle ein und gibt den TD zurück
tr.deleteCell(index)
tr.rowIndex // Gibt die Position von tr in der Tabelle zurück
td.cellIndex //Gibt die Position von td in tr zurück

<<:  25 Beispiele für Website-Design im Nachrichtenstil

>>:  Verwenden Sie CSS, um ein Datei-Upload-Muster zu zeichnen

Artikel empfehlen

Einige Datenverarbeitungsmethoden, die häufig in JS verwendet werden können

Inhaltsverzeichnis DOM-Verarbeitung Arrays Verfah...

Konfigurieren von MySQL und Squel Pro auf dem Mac

Als Reaktion auf die Popularität von nodejs haben...

Zwei Möglichkeiten zum Verwalten von Volumes in Docker

Im vorherigen Artikel habe ich die Grundkenntniss...

Beschreibung der Standardtransaktionsisolationsebene von MySQL und Oracle

1. Transaktionsmerkmale (ACID) (1) Atomarität. Di...

Lösung für mehrere 302-Antworten im Nginx-Proxy (Nginx Follow 302)

Proxying mehrerer 302er mit proxy_intercept_error...

So stellen Sie Node.js mit Docker bereit

Vorwort Node wird als mittlere Schicht im Projekt...

So implementieren Sie einen einfachen HTML-Videoplayer

Dieser Artikel stellt die Methode zur Implementie...

Implementierung von zwei Basis-Images für die Docker-Bereitstellung von Go

1. golang:neuestes Basis-Image mkdir gotest Berüh...

Lösung für mehrere Docker-Container, die nicht die gleiche Portnummer haben

Hintergrund In Docker werden vier Container mit d...