Javascript to dynamically generate a table with a specified number of rows _ javascript tips-js tutorial

The following table uses js to generate the number of rows required by the user. The specific steps are as follows. If you are interested, refer to the following, we hope this will help you to use JavaScript to generate a table with the number of required rows.
1. First, enter the following code in the body to obtain the row value entered by the user.

The Code is as follows:

Dynamic Table Generation

Line

Shows the effect:

2. Add js Code to the header

The Code is as follows:

Script
Function table (){
If (document. getElementById ("Num "). value = "" | document. getElementById ("Num "). value. search ("^ [0-9] * $") =-1 ){
Document. getElementById ("errmsg1"). style. display = "block"; // determines whether Num is null or not.
Document. getElementById ("errmsg1"). innerHTML = "message: the number of rows is null or not a number! ";
}
Else {
Document. getElementById ("errmsg1"). style. display = "none"; // hide the prompt information
Var Num = parseInt (document. getElementById ("Num"). value); // get the number of rows
Var flag = true;
Var data = "";
Data + ="

";Data + =" "+" "+" "+" "+" ";For (var I = 1; I <= Num; I ++ ){Data + =" ";Data + =" ";Data + =" ";Data + =" ";Data + =" ";}Data + ="

We are	Zhuzhu	Dudu
"+ I +"

";
Document. getElementById ("p1"). style. display = "block ";
Document. getElementById ("table1"). innerHTML = data;
}
}
Script

The generated results are as follows:

3. All code is as follows:

The Code is as follows:

<% @ Page language = "java" import = "java. util. *" pageEncoding = "UTF-8" %>
<%
String path = request. getContextPath ();
String basePath = request. getScheme () + ": //" + request. getServerName () + ":" + request. getServerPort () + path + "/";
%>




Test






Script
Function table (){
If (document. getElementById ("Num "). value = "" | document. getElementById ("Num "). value. search ("^ [0-9] * $") =-1 ){
Document. getElementById ("errmsg1"). style. display = "block"; // determines whether payNum is null or not.
Document. getElementById ("errmsg1"). innerHTML = "message: the number of rows is null or not a number! ";
}
Else {
Document. getElementById ("errmsg1"). style. display = "none"; // hide the prompt information
Var Num = parseInt (document. getElementById ("Num"). value); // gets the number of minutes
Var flag = true;
Var data = "";
Data + ="

";Data + =" "+" "+" "+" "+" ";For (var I = 1; I <= Num; I ++ ){Data + =" ";Data + =" ";Data + =" ";Data + =" ";Data + =" ";}Data + ="

We are	Zhuzhu	Dudu
"+ I +"

";
Document. getElementById ("p1"). style. display = "block ";
Document. getElementById ("table1"). innerHTML = data;
}
}
Script

Dynamic Table Generation

Line