<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>掲示板</title>
<style>
</style>
</head>
<body>
<div id="form">
<h1>掲示板</h1>
<input type="text" id="msgbox">
<input type="submit" id="sentbtn">
</div>
<div id="tlbox">
<ul id="timeline">
</ul>
</div>
<script>
const msg=document.getElementById('msgbox');
const sent=document.getElementById('sentbtn');
const tl=document.getElementById('timeline');
sent.onclick=function sentmsg(){
var ms=msg.value;
console.log(ms);
var n=tl.childElementCount;
switch(ms){
case '':
break;
default:
switch(n){
case'':
n=1
break;
default:
n=n+1;
}
console.log(n);
const box=document.createElement('li');
tl.appendChild(box);
box.id='msg'+n;
const a=document.getElementById('msg'+n);
a.style.listStyleType='none';
a.innerHTML=n+'.'+ms;
msg.value='';
}
}
'use strict';
</Script>
</body>
</html>
