라라리라
2023.09.11 / Step 4 [DOM_태그생성] - 코딩 49 일차 본문
_0407_문자열로테이블생성1.html
<!DOCTYPE html>
<html lang="ko">
<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>
let str = "<table border='1'>";
str += "<tr>";
str += "<td>1</td><td>2</td><td>3</td>";
str += "</tr>";
str += "<tr>";
str += "<td>1</td><td>2</td><td>3</td>";
str += "</tr>";
str += "<tr>";
str += "<td>1</td><td>2</td><td>3</td>";
str += "</tr>";
str += "</table>";
document.write(str);
</script>
</body>
</html>
_0408_문자열로테이블생성2.html
<!DOCTYPE html>
<html lang="ko">
<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>
document.write("<h1>구구단표</h1>");
document.write("<table border='2'>");
for (let i = 1; i <= 9; i++) {
document.write("<tr>");
document.write("<td>" + i + "</td>");
for (let j = 2; j <= 9; j++) {
document.write("<td>" + i * j + "</td>");
}
document.write("</tr>");
}
document.write("</table>");
</script>
</body>
</html>
_0409_문자열로스타일생성1.html
<!DOCTYPE html>
<html lang="ko">
<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>
<style>
.blue { color: #00f; }
.red { color: #f00; }
</style>
</head>
<body>
<script>
let i = 20;
while( i >= 10 ){
if( i % 2 == 0 ){
document.write("<p class='blue'>" + i + "</p>");
}else{
document.write("<p class='red'>" + i + "</p>");
}
i--;
}
</script>
</body>
</html>
_0410_문자열로스타일생성2.html
<!DOCTYPE html>
<html lang="ko">
<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>
<style>
.red{color: #f00;}
.green{color: #00f;}
.aqua{color: #0ff;}
</style>
</head>
<body>
<script>
for(let i = 1; i <= 100; i++){
if(i % 5 == 0 && i % 7 != 0) {
document.write("<p class='red'>"+i+"</p>");
} else if(i % 7 == 0 && i % 5 != 0) {
document.write("<p class='green'>"+i+"</p>");
} else if(i % 7 == 0 && i % 5 == 0) {
document.write("<p class='aqua'>"+i+"</p>");
}
}
</script>
</body>
</html>
'코딩 > 2023 JavaScript DOM' 카테고리의 다른 글
| 2023.09.13 / Step 5 [DOM_비동기] - 코딩 51 일차 (0) | 2023.09.13 |
|---|---|
| 2023.09.12 / Step 5 [DOM_비동기] - 코딩 50 일차 (0) | 2023.09.12 |
| 2023.09.08 / Step 4 [DOM_태그생성] - 코딩 48 일차 (0) | 2023.09.08 |
| 2023.09.07 / Step 3 [DOM_이벤트] - 코딩 47 일차 (0) | 2023.09.07 |
| 2023.09.06 / Step 3 [DOM_이벤트] - 코딩 46 일차 (0) | 2023.09.06 |