가장 간단 한 todolist 웹 페이지 구현

 
  
    ：
 
  
    1    ：                                            （+                      
 
  
     2.    ：            ‘-’              ，          --%>
 
  
  ：
 
  




    


    ： + -



    var idOfElement=0;
    var a=[];
    function displayTask() {
        fa=document.body;
        for(var i=0;i<a.length;i++)
        {
            fa.appendChild(a[i]);
        }
    }
    function createTask() {

        if($("#hi").val())
        {

            var li=document.createElement("class");
            var text=document.createTextNode($("#hi").val())
            var butt=document.createElement("input");
            butt.setAttribute("type","checkbox");
            // butt.setAttribute("checked","");
            butt.setAttribute("id",'a'+idOfElement.toString());
            li.appendChild(butt);
            li.appendChild(text);
            butt=document.createElement("br");
            li.appendChild(butt);
            li.setAttribute("id",idOfElement.toString());
            idOfElement++;
            a.push(li);

            $("#hi").val("");

        }

    }
    function rmChecked()
    {
        for(var i=0;i<a.length;i++)
        {
            if(a[i].childNodes[0].getAttribute("checked"))
            {
                $(a[i]).remove();
                a.splice(i,1);
                i--;
            }
        }

    }
    function rmInput()
    {
        var num=parseInt($("#hi").val());
        if(a.length>0)
        {
            if(!isNaN(num))
            {
                if(num>=0 && num < a.length)
                {
                    $(a[num]).remove();
                    a.splice(num,1);
                    $("#hi").val("");
                    displayTask();
                }
            }


        }
    }
    document.body.οnclick=function (ev) {
        var obj=document.elementFromPoint(ev.clientX,ev.clientY);
        if(obj.id==="bt1")
        {
            createTask();
            displayTask();
        }
        else if(obj.id==="bt2")
        {
            rmInput();
            rmChecked();
        }
        else if(isNaN(parseInt(obj.id)))
        {
            obj.setAttribute("checked",true);
        }
    }
    $("#hi").keydown(
        function (e) {
            if(e.which==13)
            {
                createTask();
                displayTask();
            }
        }
    );