이 기사의 예에서는 JS가 웹페이지를 제어하여 행과 열의 개수에 관계없이 테이블을 동적으로 생성하는 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 분석은 다음과 같습니다. 온라인 테이블 생성을 위한 JS 코드 효과를 사용하는 것은 매우 간단합니다 JS 함수코드를 통해 행과 열의 개수를 직접 입력하면 필요한 테이블이 자동으로 생성됩니다 물론 JS 코드를 확장하여 다양한 형태의 텍스트를 생성할 수도 있습니다 코드 복사 코드는 다음과 같습니다. Js는 동적으로 테이블을 생성합니다 <br> 테이블{글꼴 크기:14px;}<br> </스타일><br> </머리><br> <br> <스크립트 언어="javascript"><br> 함수 테이블click(name1,name2,name3){<br> Trow=name1.value;<br> Tcol=name2.value;<br> TV=name3.value;<br> if ((Trow=="") || (Tcol=="") || (Tv=="")){<br> Alert("폼 작성을 위한 조건을 모두 채워주세요.");<br> }<br> 그렇지 않으면{<br> r=parseInt(Trow);<br> c=parseInt(Tcol);<br> 테이블1(r,c,Tv);<br> }<br> }<br> 함수 테이블값(a,ai,rows,col,str){<br> int1=a.length;<br> (i=0;i for (j=0;j<col; j){<br /> If ((j==0)&&(ai>=int1)){break;}<br> if (ai>=int1){<br> str=str "<td 범위='col'> </td>";<br> }<br> 그렇지 않으면{<br> 만약 (j==0){<br> str=str "<tr><th 범위='col'> " (a[ai ]) "</th>";<br> }<br> 그렇지 않으면{<br> 만약 (j==col-1){<br> str=str "<td 범위='col'> " (a[ai ]) "</td>";<br> }<br> 그렇지 않으면{<br> str=str "<td 범위='col'> " (a[ai ]) "</td>";<br> }<br> }<br> }<br> }<br> str=str "</tr>";<br> }<br> 문자열을 반환합니다;<br> }<br> 함수 Table1(행,열,Str1){<br> var str="";<br> a=새 배열();<br> s=new String(Str1);<br> a=s.split("#");<br> int1=a.length;<br> ai=0;<br> if (col<=int1){<br /> str=str "<테이블 너비='300' 테두리='4'>";<br> (i=0;i<col i> if (i==0){<br> str=str "<tr><th 범위='col'> " (a[ai ]) "</th>";<br> }<br> 그렇지 않으면{<br> If (i==(col-1)){<br> str=str "<th 범위='col'> " (a[ai ]) "</th></tr>";<br> }<br> 그 외{<br> str=str "<th 범위='col'> " (a[ai ]) "</th>";<br> }<br> }<br> }<br> If (int1>col){<br> (행>1){<br> str=테이블값(a,ai,row-1,col,str);<br> }<br> }<br> str=str "</테이블>";<br> aa.innerHTML=str;<br> }<br> }<br> <br> <form name="form1" method="post" action=""><br> <p><b>줄 수:</b><br> <input name="name1" type="text" style="width:40px" value="4"><br> <b>열 수:</b><br> <input name="name2" type="text" style="width:40px" value="4"><br> <input type="button" name="Submit3" value="테이블 생성" onClick="tableclick(document.form1.name1,document.form1.name2,document.form1.name3)"></p> <br> <p><b align="top">테이블 값: </b></p><br> <p><br> <input name="name3" Wrap="VIRTUAL" style="width:520px " value="COL1#COL2#COL3#COL4#ROW1#A1#A2#a3#ROW2#B1#B2#B3#ROW3#C1 #C2#C3"><br> <br> </양식><br> <div id="aa"></div><br> </본문><br> </div>
