SOURCE

console 命令行工具 X clear

                    
>
console
  function alertSecond(){
      alert("第二次");
  }
  function changeColor(){
      if(this.style.color=="red"){
          this.style.color="black";
      }else{
          this.style.color="red";
      }
      
  }
  function changeBackgroundColor() {
       console.log(this.textContent);
    if (this.style.backgroundColor == "lightskyblue") {
        this.style.backgroundColor = "white";
    }
    else {
         this.style.backgroundColor = "lightskyblue";
    }
   
} 
function changeColorAndBackgroundColor() {
    
    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";
    }

}
  window.onload = function () 
        {
             //事件处理器和事件监听器
             //onclick只显示最后一次的输出
            var oBtn = document.getElementById("btn");
            oBtn.onclick = function () {
                alert("第1次");
            };
            oBtn.onclick = function () {
                alert("第2次");
            };
            oBtn.onclick = function () {
                alert("第1次");
                alert("第2次");
                alert("第3次");
            };
            var oBtn=document.getElementById("listenBtn");
            oBtn.addEventListener("click",function(){
                alert("第一次");
            }, false);
            oBtn.addEventListener("click",alertSecond,false);
            oBtn.removeEventListener("click",alertSecond,false);
//解除,按下广州新华学院字体背景变色,
//再点解除,之后再点广州新华学院字体颜色就不变了,但背景颜色还会变
            var oPContent=document.getElementById("content");
            oPContent.addEventListener("click",changeColor,false);
            oPContent.addEventListener("click",changeBackgroundColor,false);

            var oBtn=document.getElementById("removeBtn");
            oBtn.addEventListener("click",function(){
                oPContent.removeEventListener("click",changeColor,false);
            },false);
           
//解除,按下信息科学学院,字体变颜色,之后按解除,再点击信息科学学院字体颜色就不会改变了

           var oPContent1=document.getElementById("content1");
            oPContent1.onclick = changeColorAndBackgroundColor;

            var oBtn1=document.getElementById("removeBtn1");
            oBtn1.addEventListener("click",function(event){
                alert(event.type);
                oPContent1.onclick = changeBackgroundColor;
            },false);

            //按下键盘,按下某一个数字和字母,会有对应的键码出来
            document.addEventListener("keydown",function(){
                console.log(event.type);
                //不显示shiftkey
                if(event.shiftKey||event.altkey||event.ctrlKey){
                    console.log("你按下了shift,alt 或者ctrl");
                }
                console.log("你按下啦"+event.keyCode);
            });
            //松开键盘,提示相应的文本
             document.addEventListener("keyup",function(){
                 console.log(event.type);
                console.log("你松开啦"+event.keyCode);
            });

        } 
<!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>