console 命令行工具 X clear

console

function alertSecond()
    {
        alert("第二次");
    }

  

window.onload=function()
{
        function changeColor() 
        {
            if (this.style.color == "red") 
            {
                this.style.color = "black";
            }
            else 
            {
                this.style.color = "red";
            }
        }

    function changeBackgroundColor() 
    {
        if (this.style.backgroundColor == "lightskyblue") 
        {
            this.style.backgroundColor = "white";
        }
        else 
        {
            this.style.backgroundColor = "lightskyblue";
        }
    }

    var oBtn = document.getElementById("btn");

    oBtn.onclick = function()
    {
        alert("第一次");
    }
    oBtn.onclick = function()
    {
        alert("第二次");
    }
    oBtn.onclick = function()
    {
        alert("第三次");
    }

    oBtn.onclick = function()
    {
        alert("第一次");
        alert("第三次");
    }
    var oListenBtn = document.getElementById("listenBtn");

    oListenBtn.addEventListener("click",function()
    {
        alert("第一次");
    },false);

    oListenBtn.addEventListener("click",alertSecond,false);
    
    function alertThird()
    {
        alert("第三次");
    }

    oListenBtn.addEventListener("click",alertThird,false);
    oListenBtn.removeEventListener("click",alertSecond,false);




//事件监听器
    var oPContent = document.getElementById("content");
    oPContent.addEventListener("click",changeColor,false);
    oPContent.addEventListener("click",changeBackgroundColor,false);

    var oRemoveBtn = document.getElementById("removeBtn");
    oRemoveBtn.addEventListener("click",function()
    {
        oPContent.removeEventListener("click",changeColor,false);
    },false);
//事件处理器
    var oPContent1= document.getElementById("content1");
    oPContent1.onclick = function()
    {
        if(this.style.color == "red")
        {
            this.style.color = "black";
        }
        else
        {
            this.style.color = "red";
        }
        if(this.style.backgroundColor == "lightskyblue")
        {
            this.style.backgroundColor = "white";
        }
        else
        {
            this.style.backgroundColor = "lightskyblue";
        }
    }

    var oRemoveBtn1= document.getElementById("removeBtn1");
    oRemoveBtn1.addEventListener("click",function()
    {
            oPContent1.onclick = function()
        {
            if(this.style.backgroundColor == "lightskyblue")
            {
                this.style.backgroundColor = "white";
            }
            else
            {
                this.style.backgroundColor = "lightskyblue";
            }
        }
    },false);


//event对象
    document.addEventListener("keydown", function(event){
        console.log(event.type);
        console.log("你按下 " + event.keyCode);
        if (event.altKey) {
            console.log("你按下了Alt");
        }
        if (event.ctrlKey) {
            console.log("你按下了Ctrl");
        }
        if (event.shiftKey) {
            console.log("你按下了Shift");
        }
    }, false)

    document.addEventListener("keyup", function(event){
        console.log(event.type);
        console.log("你松开 " + event.keyCode);
        if (event.altKey) {
            console.log("你松开了Alt");
        }
        if (event.ctrlKey) {
            console.log("你松开了Ctrl");
        }
        if (event.shiftKey) {
            console.log("你松开了Shift");
        }
    }, false) 
}

<!DOCTYPE html> 
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
      
    </script>
</head>
<body>
    <input id="btn" type="button" value="按钮"/>
    <br/>
    <br/>
    <input id="listenBtn" type="button" value="监听按钮"/>

    <div>
        <p id="content">广州新华学院</p>

        <button id="removeBtn">解除</button>
    </div>

    <div>
        <p id="content1">信息科学学院</p>

        <button id="removeBtn1">解除</button>
    </div>
</body>
</html>