[ 자바스크립트 ] table 태그 만들기 - createElement()

자바스크립트로 테이블을 만들면서, 오늘 날짜를 집어넣었다.
createElement()와 appendChild()를 이용함.

 
<div id="setTable"></div>


<script type="text/javascript">

var date = new Date(); 
var string = date.toLocaleString(); 

var td = document.createElement( "TD" ); 
     td.innerHTML = string; 
     td.style.border = "1px solid #92acbb"; 
     td.style.padding = "3px"; 

var tr = document.createElement( "TR" ); 
     tr.appendChild( td ); 

var table = document.createElement( "TABLE" ); 
     table.appendChild( tr ); 

setTable.appendChild( table ); 

</script>
 

위와 같이 작성하면, 아래와 같은 내용이 표시될 것이다.

키보드의 "F12"키를 눌러서 살펴보면, 아래와 같은 구조의 테이블이 삽입되어 있을 것이다.

 
<div id="setTable">
    <table>
        <tr>
            <td style="border: 1px solid #92acbb; padding: 3px;"></td>
        </tr>
    </table>
</div>
 

이 블로그에서 함께 볼만한 글 ☞ [JavaScript] 오늘 날짜와 현재 시각 ─ Date()

이 내용이 도움이 되셨나요? *^^*