JAVA/JavaScript
javascript 배열로 공지사항 만들기, legend, fieldset
java나유
2022. 7. 18. 23:32
<!DOCTYPE html>
<html lang="kor">
<head>
<meta charset="UTF-8">
<title>0718 function 없이 script를 body밑으로 legend / fieldset</title>
<script>
var notice = [ "2022년 5월부터 야간개장 오픈!!", "한국민속촌 귀굴 5월~11월까지 개장!!",
"봄엽서 시골 여름 이벤트 행사 7월~9월까지" ];
</script>
<style>
.notice {
font-size: 13px;
font-weight: bodl;
width: 150px;
height: 30px;
background-color: black;
border-radius: 30px;
color: white;
line-height: 30px;
text-align: center;
}
</style>
</head>
<body>
<fieldset>
<legend class="notice">공지사항[NOTICE]</legend>
<ul id="notice"></ul>
</fieldset>
</body>
<script>
var html,text
for (var i = 0; i < notice.length; i++) {
html = document.createElement("li");
text = document.createTextNode(notice[i]);
html.append(text);
document.getElementById("notice").append(html);
}
</script>
</html>
728x90