Dieser Artikel beschreibt die Methode von JS, die die dynamische Erzeugung von willkürlichen Zeilen- und Spalten -Tabellen auf der Webseite steuert. Teilen Sie es für Ihre Referenz. Die spezifische Analyse ist wie folgt:
Dies ist ein sehr einfacher Codeeffekt für das Online -Generieren von Tabellen mit JS
Über den JS -Funktionscode können Sie automatisch die Tabelle generieren, die Sie benötigen, indem Sie die Anzahl der Zeilen und Spalten direkt eingeben
Natürlich können Sie auch den JS -Code erweitern, um verschiedene Formulare des Generationstextes zu implementieren
Kopieren Sie den Code wie folgt: <html>
<kopf>
<title> js generieren dynamisch Tabellen </title>
<style type = "text/css">
Tabelle {Schriftgröße: 14px;}
</style>
</head>
<body>
<script Language = "JavaScript">
Funktion tableClick (name1, name2, name3) {
Trow = name1.Value;
Tcol = name2.Value;
TV = name3.Value;
if ((Trow == "") || (tcol == "") || (tv == "")) {
ALERT ("Bitte füllen Sie die Bedingungen für die Erstellung des Formulars aus");
}
anders{
R = ParseInt (Kelle);
C = ParseInt (tcol);
Tabelle 1 (R, C, TV);
}
}
FunktionstableValue (A, AI, Reihen, col, str) {
int1 = a.länge;
für (i = 0; i <Zeilen; ++ i) {
für (j = 0; j <col; ++ j) {
if ((j == 0) && (ai> = int1)) {break;}
if (ai> = int1) {
str = str+"<td scope = 'col'> </td>";
}
anders{
if (j == 0) {
str = str+"<tr> <th scope = 'col'>"+(a [ai ++])+"</th>";
}
anders{
if (j == col-1) {
str = str+"<td scope = 'col'>"+(a [ai ++])+"</td>";
}
anders{
str = str+"<td scope = 'col'>"+(a [ai ++])+"</td>";
}
}
}
}
str = str+"</tr>";
}
return str;
}
Funktion Tabelle 1 (Zeile, col, str1) {
var str = "";
a = new Array ();
S = neuer String (str1);
a = ssplit ("#");
int1 = a.länge;
ai = 0;
if (col <= int1) {
str = str+"<Tabellenbreite = '300' Border = '4'>";
für (i = 0; i <col; ++ i) {
if (i == 0) {
str = str+"<tr> <th scope = 'col'>"+(a [ai ++])+"</th>";
}
anders{
if (i == (col-1)) {
str = str+"<th scope = 'col'>"+(a [ai ++])+"</th> </tr>";
}
anders{
str = str+"<th scope = 'col'>"+(a [ai ++])+"</th>";
}
}
}
if (int1> col) {
if (row> 1) {
str = tableValue (a, ai, row-1, col, str);
}
}
str = str+ "</table>";
aa.innerhtml = str;
}
}
</script>
<Formular name = "Form1" methode = "post" action = "">
<p> <b> Zeilennummer: </b>
<input name = "name1" type = "text" value = "4">
<b> Anzahl der Spalten: </b>
<input name = "name2" type = "text" value = "4">
<input type = "button" name = "suble3" value = "table generate" onclick = "tableclick (document.form1.name1, document.form1.name2, document.form1.name3)"> </p>
<p> <b align = "top"> Tabellenwert: </b> </p>
<p>
<Eingabe name = "name3" Wrap = "virtual" value = "col1#col2#col3#col4#row1#a1#a2#a3#row2#b1#b2#b3#row3#c1#c2#c3">
</p>
</form>
<div id = "aa"> </div>
</body>
</html>
Ich hoffe, dieser Artikel wird für JavaScript -Programme aller hilfreich sein.