이 기사에서는 웹 페이지의 임의 행 및 열 테이블의 동적 생성을 제어하는 JS 방법에 대해 설명합니다. 참조를 위해 공유하십시오. 특정 분석은 다음과 같습니다.
이것은 JS를 사용하여 온라인으로 테이블을 생성하기위한 매우 간단한 코드 효과입니다.
JS 기능 코드를 통해 행 및 열 수를 직접 입력하여 필요한 테이블을 자동으로 생성 할 수 있습니다.
물론, JS 코드를 확장하여 다양한 형태의 텍스트를 구현할 수도 있습니다.
다음과 같이 코드를 복사하십시오. <html>
<헤드>
<title> js는 동적으로 테이블을 생성합니다 </title>
<스타일 유형 = "텍스트/CSS">
표 {font-size : 14px;}
</스타일>
</head>
<body>
<script language = "javaScript">
함수 식탁보 (name1, name2, name3) {
trow = name1.value;
tcol = name2.value;
TV = name3.Value;
if ((trow == "") || (tcol == "") || (TV == "")) {
경고 ( "양식을 작성하기위한 조건을 작성하십시오");
}
또 다른{
r = parseint (trow);
c = parseint (TCOL);
표 1 (R, C, TV);
}
}
함수 tableValue (a, ai, 행, col, str) {
int1 = A.length;
for (i = 0; i <rows; ++ i) {
for (j = 0; j <col; ++ j) {
if ((j == 0) && (ai> = int1)) {break;}
if (ai> = int1) {
str = str+"<td scope = 'col'> </td>";
}
또 다른{
if (j == 0) {
str = str+"<tr> <th scope = 'col'>"+(a [ai ++])+"</th>";
}
또 다른{
if (j == col-1) {
str = str+"<td scope = 'col'>"+(a [ai ++])+"</td>";
}
또 다른{
str = str+"<td scope = 'col'>"+(a [ai ++])+"</td>";
}
}
}
}
str = str+"</tr>";
}
Return str;
}
함수 표 1 (행, col, str1) {
var str = "";
a = new Array ();
s = 새 문자열 (str1);
a = s.split ( "#");
int1 = A.length;
ai = 0;
if (col <= int1) {
str = str+"<테이블 너비 = '300'테두리 = '4'>";
for (i = 0; i <col; ++ i) {
if (i == 0) {
str = str+"<tr> <th scope = 'col'>"+(a [ai ++])+"</th>";
}
또 다른{
if (i == (col-1)) {
str = str+"<th scope = 'col'>"+(a [ai ++])+"</th> </tr>";
}
또 다른{
str = str+"<th scope = 'col'>"+(a [ai ++])+"</th>";
}
}
}
if (int1> col) {
if (행> 1) {
str = tableValue (a, ai, row-1, col, str);
}
}
str = str+ "</table>";
aa.innerhtml = str;
}
}
</스크립트>
<form name = "form1"method = "post"action = "">
<p> <b> 줄 번호 : </b>
<입력 이름 = "name1"type = "text"value = "4">
<b> 열 수 : </b>
<입력 이름 = "name2"type = "text"value = "4">
<input type = "button"name = "dovers3"value = "table generate table"onclick = "TableClick (document.form1.name1, document.form1.name2, document.form1.name3)"> </p>
<p> <b align = "top"> 테이블 값 : </b> </p>
<p>
<입력 이름 = "name3"wrap = "virtual"value = "col1#col2#col3#col4#a1#a2#a3#row2#b1#b2#b3#row3#c1#c2#c3">
</p>
</form>
<div id = "aa"> </div>
</body>
</html>
이 기사가 모든 사람의 JavaScript 프로그래밍에 도움이되기를 바랍니다.