중첩 for문 이용하여 테이블 만들기

자바스크립트

기본 예제를 통해 감을 익히는중이다.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var num = 1;
        var t = "<table border=1>";
        for(var i=1; i<=5;i++){


            t += "<tr>"; //행
            
            for(var k=1; k<=5; k++){
                t += "<td>" + num + "</td>";
                num++;
            }

            t += "</tr>";
        }

        t += "</table>";
        console.log(t);
        document.write(t);

    </script>
</body>
</html>

결과물

이번 것에서 배운 내용

1. table 태그를 활용하기

2. 행은 tr 태그로

3. 열은 td 태그로

4. 항상 태그는 열었으면 닫는 태그도 같이 넣어주기

5. console.log 를 이용해서 잘 출력되는지 한번 더 확인해보기

6. 연산자 우선순위에서 가장 낮은 우선순위를 갖고 있는 : 대입 연산자(복합 대입) += 활용해보기 ( 변수 t에다가 html 죕다 집어 던지기 시전!)

저작자표시

'🗝️소프트웨어 > 📗JavaScript' 카테고리의 다른 글

[Vue.js] 문법 기초 1편(props, v-bind, v-on, router, axios) (0)	2022.09.18
자바스크립트 객체 개념 총정리 (0)	2022.08.11
홀짝에 따라 다른 색상 주기(span태그, p태그 color, style 지정) (0)	2022.08.11
연산자 우선순위 (0)	2022.08.09
로그인 서비스 전체 흐름 (0)	2021.09.29

'🗝️소프트웨어 > 📗JavaScript' 카테고리의 다른 글

티스토리툴바