console 命令行工具 X clear

console

function alertSecond(){
    alert("第2次");
}
function changeColor(){
    if(this.style.color=="red"){
        this.style.color="black";
    }
    else{
        this.style.color="red";
    }
}

function addBorder(){
    if(this.style.fontSize=="30px"){
        this.style.border="10px";
    }
    else{
        this.style.fontSize="30px";
    }
}
function changeBackgroundColor(){
    if(this.style.backgroundColor=="lightskyblue"){
        this.style.color="white";
    }
    else{
        this.style.color="lightskyblue";
    }
}
window.onload=function(){
    var oBtn=document.getElementById("btn");
    oBtn.onclick=function(){
        alert("第1次");
    }
     oBtn.onclick=function(){
        alert("第2次");
    }
     oBtn.onclick=function(){
        alert("第3次");
    }
     oBtn.onclick=function(){
        alert("第1次");
        alert("第2次");
        alert("第3次");
    }
     oBtn.onclick=function(){
        alert("第1次");
        alert("第3次");
    }
    var oListenBtn=document.getElementById("listenBtn");
    oListenBtn.addEventListener("click",function(){
        alert("第1次");
    },false);
    oListenBtn.addEventListener("click",alertSecond,false);
    oListenBtn.addEventListener("click",function(){
        alert("第3次");
    },false);
    function alertThird(){
    alert("第3次");
    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 oPConten1=document.getElementById("content1");
    oPConten1.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(){
        oPConten1.onclick=function(){
            if(this.style.backgroundColor=="lightskyblue"){
                this.style.backgroundColor="white";
            }
            else{
                this.style.backgroundColor="lightskyblue";
            }
        }
    },false);

    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>