Created dom

The following describes how to generate a page with a date in the box

First, write a function using document.createElement date of assignment to create a document node div, then the output function of time in the div, use document.body.appendChild (div); div write the body inside, then how will generation contains a function of time we do div triggered by document.addEventListener document inside the div, since with div (box) will set up a positioning we use div.setAttribute ( "style", "font -size: 20px; color: cyan; salmon; font-family: ' Microsoft yahei'; border-radius: 20px; padding: 30px; text-align: center; background: brown; position: absolute; left: "+ e.clientX +" px; top: "+ e.clientY +" px; " ); in position: absolute; left:" + e.clientX + "px; top:" + e.clientY + "px; function to set the position of the box to a position of the mouse click, below code share to you!

<the p-style = " text-align = left: Center; font-size: 30px; font-Family: 'Microsoft elegant black'; Color: Brown; " > click on the screen to get the current date </ the p-> 
<Script> var DATE = new new a Date ();
         var year = the Date.getFullYear ();
         var month The date.getMonth = () + 1 ;
         var a dates = date.getDate ();
         var ARR = [ " Sunday " , " week 1 " , " week 2 " , " week 3 " , " week 4 ","
        
        星期5","星期6"];
        var day = date.getDay();
        var a4 = (year+"年-"+month+"月-"+dates+"日-"+arr[day]);        
        var div = document.createElement("div");
        
        document.addEventListener("click",function(e){
            div.setAttribute("style","font-size:20px ; color: cyan;salmon;font-family: '微软雅黑'; border-radius: 20px; padding:30px; text-align:center; background: brown;position:absolute; left:"+e.clientX+"px; top:"+e.clientY+"px;");
            div.innerHTML = a4;
            document.body.appendChild(div);
        });
</script>

Page effect