js做留言板（可以评论 删除评论 评论时间）

    
    
    
    
    


    

        
留言板
        

        

             
             

                 
             
             
    

    

　　

let data = [{
    username:"张三0",
    time:"2017-09-07 09:11:00",
    text:"留言内容0"},{
        username:"张三1",
        time:"2017-09-08 09:11:00",
    text:"留言内容0"},{
        username:"张三2",
        time:"2017-09-09 09:11:00",
    text:"留言内容0"
}];

render();
addBtn.addEventListener("click",() =>{
    addMessage();
})

content.addEventListener("keydown",(e) =>{
    if (e.keyCode === 13){
        addMessage();
    }
},false)

exhibit.addEventListener("click" , (e) =>{
    console.log(e)
    if (e.target.className === "removeBtn"){
        // e.preventDefault();
        e.preventDefault();
        let i =e.target.getAttribute("_id");
        data.splice(i,1);
        render();
    }
}, false)

function addMessage(){
    data.push({
        username:`张三${data.length}`,
        time:getNowTime(),
        text:content.value
    });
    content.value = "";
    render();
}

function render(){
    exhibit.innerHTML = data.map((item, index) =>{
                return `

                

                    ${item.username}
                    ${item.time}
                
                
${item.text}
                

                    删除
                
                
`
    }).join("");
}

function getNowTime(){
    let date = new Date();
    let year = date.getFullYear();
    let month = date.getMonth() + 1;
    month =judgeTime(month);
    let day = date.getDate();
    day = judgeTime(day);
    let hours = date.getHours();
    hours = judgeTime(hours);
    let minutes = date.getMinutes();
    minutes = judgeTime(minutes);
    let seconds = date.getSeconds();
    seconds = judgeTime(seconds);
    let nowTime = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
    return nowTime;
}

function judgeTime(time){
    if(time < 10 && time > 0){
        time = "0" + time;
    }
    return time;
}

　　

转载于:https://www.cnblogs.com/gao2/p/11528682.html