Detaillierte Erklärung dynamisch generierter Tabellen mit Javascript

*Seite erstellen: zwei Eingabefelder und ein Button

*Code und Schritte
/*
1. Holen Sie sich die Eingabezeilen- und -spaltenwerte
2. Erstellen Sie eine Tabelle
** Schleifenreihen
** Durchlaufen Sie die Zellen einer Zeile
3. Anzeige auf der Seite
- Setzen Sie den Tabellencode innerhalb des div
- Verwenden Sie die innerHTML-Eigenschaft
*/

Der Code lautet wie folgt:

<html>
 <Kopf>
  <title>Tabelle dynamisch generieren</title>
  <Stiltyp = "Text/CSS">
  </Stil>
 </Kopf>
 <Text>
   Zeile: <input type="text" id="h"/><br/>
   Spalte: <input type="text" id="l"/><br/>
   <input type="button" value="Generieren" onclick="add1()"/>
   <div id="divv">
   </div>
 </body>
 <Skripttyp="text/javascript">
	Funktion add1(){
		/*
			1. Holen Sie sich die eingegebenen Zeilen- und Spaltenwerte. 2. Generieren Sie eine Tabelle. - Durchlaufen Sie die Zeilen. - Durchlaufen Sie die Zellen in einer Zeile. 3. Zeigen Sie sie auf der Seite an. - Verwenden Sie das Attribut innerHTML, um den Tabellencode in einem div festzulegen. */
		var h =document.getElementById("h").value;
		//alarm(h);
		var l =document.getElementById("l").value;
		var tab = "<Tabellenrand='1' Randfarbe='rot'>";
		für(var i=0;i<h;i++){
			Tabulator + = "<tr>";
			für(var j=0;j<l;j++){
				Tabulatortaste +="<td>aaaa</td>"
			}
			Tabulatortaste +="</tr>"
		}
		Registerkarte +="</table>";
		var div1 = document.getElementById("divv");
		div1.innerHTML = Tab;
	}
   </Skript>
</html>

Demonstration des Wirkungsdiagramms:

Zusammenfassen

Dieser Artikel endet hier. Ich hoffe, er kann Ihnen helfen. Ich hoffe auch, dass Sie mehr Inhalten auf 123WORDPRESS.COM mehr Aufmerksamkeit schenken können!

Das könnte Sie auch interessieren:

Detaillierte Erklärung zur Implementierung dynamischer Tabellen in JavaScript
JavaScript zum Erreichen eines dynamischen Farbwechsels der Tabelle
JavaScript zum Erzielen eines dynamischen Tabelleneffekts
JavaScript zum Implementieren einer einfachen dynamischen Tabelle
JavaScript zum dynamischen Generieren von Tabellen auf Webseiten
Beispiel für die dynamische Generierung einer Tabelle mit JavaScript
Detaillierte Erklärung zur Generierung dynamischer Tabellen und dynamischer Effekte mit JavaScript

<<: Binäre Typoperationen in MySQL

>>: Allgemeine Symbole in Unicode