SOURCE

console 命令行工具 X clear

                    
>
console
function alertMes() {
    alert("广州新华学院");
}

window.onload = function(){
    document.getElementById("welcome").onclick = function(){
        alert("欢迎您!");
    }

    document.getElementById("btn").onclick = function(){
        alert("我不是按钮");
    }

    var oPContent= document.getElementById("content");
    oPContent.onmouseover = function () {
        this.style.color = "red";
    }
     oPContent.onmouseout = function () {
        this.style.color = "black";
    }

    var oBtn1= document.getElementById("btn1");
    oBtn1.onmousedown = function() {
        oPContent.style.color = "blue";
    }
    oBtn1.onmouseup = function() {
        oPContent.style.color = "black";
    }

    var oString = document.getElementById("string");
    var oLength = document.getElementById("length");
    oString.onkeyup = function() {
        var str = oString.value;
        oLength.innerHTML=str.length;
    }
    var oNumber = document.getElementById("number");
    var oHint = document.getElementById("hint");
    oNumber.onkeyup = function() {
        var regex=/^[0-9]*$/;
        if (regex.test(oNumber.value)){
            oHint.innerHTML="输入正确";
            oHint.style.color = "green";

        }
        else {
            oHint.innerHTML="必须输入数字";
            oHint.style.color = "red";
        }
    }

    //获取元素对象
    var oSearch = document.getElementById("search");
    //获取焦点
    oSearch.onfocus = function () 
    {
        if (this.value == "百度一下,你就知道") 
        {
            this.value = "";
        }
    };
    //失去焦点
    oSearch.onblur = function () 
    {
        if (this.value == "") 
        {
            this.value = "百度一下,你就知道"; 
        }
    };

    oString.focus();
    oString.oncopy = function() {
        return false;
    }

    var oTxt1 = document.getElementById("txt1");
    var oTxt2 = document.getElementById("txt2");
    oTxt1.onselect = function () 
    {
        alert("你选中了单行文本框中的内容");
    };
    oTxt2.onselect = function () 
    {
       // alert("你选中了多行文本框中的内容");
    };
    oTxt2.onclick = function() {
        this.select();
    }

    var oFruit = document.getElementsByName("fruit");
    var oP = document.getElementById("fruit");
    for (var i = 0; i < oFruit.length; i++) 
    {
        oFruit[i].onchange = function () 
        {
            if (this.checked) 
            {
                oP.innerHTML = "你选择的是:" + this.value;
            }
        };
    }
    var oSelectAll = document.getElementById("selectAll");
    var oFruit = document.getElementsByName("fruit1");
    oSelectAll.onchange = function () 
    {
        //如果选中,即this.checked返回true
        if (this.checked) {
            for (var i = 0; i < oFruit.length; i++) 
            {
                oFruit[i].checked = true;
            }
        } else {
            for (var i = 0; i < oFruit.length; i++) 
            {
                oFruit[i].checked = false;
            }
        }
    };


    var oList = document.getElementById("list");
    oList.onchange = function () 
    {
        var link = this.options[this.selectedIndex].value;
        window.open(link);
    };

    document.body.oncopy = function () {
        return false;
    }
    document.body.onselectstart=function()
    {
        return false;
    }
    document.oncontextmenu = function () 
    {
        return false;
    }
    var oBtn2 = document.getElementById("btn2");
    oBtn2.onclick = function () 
    {
        alert("JavaScript");
    };
}

window.onbeforeunload  = function(e) {
    e.returnValue="记得下次要来哦!";
}
<!DOCTYPE html> 
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <style type="text/css">
        
    </style>
    <script>
    </script>
</head>
<body>
    <button onclick="alertMes()">弹出信息</button>
    <br/>
    <br/>
    <button id="welcome">弹出欢迎信息</button>
    <br/>
    <br/>
    <div id="btn">点我</div>
    <div>
        <p id="content">广州新华学院</p>
        <button id="btn1">按下松开</button>
    </div>
    <div>
        <label>输入任意字符:</label>
        <input type="text" id="string"></input>
        <br/>
        <label>字符串长度为:</label>
        <span id="length">0</span>
    </div>
    <br/>
    <div>
        <label>输入数字:</label>
        <input type="text" id="number"></input>
        <br/>
        <div id="hint"></div>
    </div>
    <br/>
    <div>
        <input type="text" id="search" value="百度一下,你就知道"></input>
        <br/>
        <div id="hint"></div>
    </div>
     <br/>
    <div>
        <input id="txt1" type="text" value="如果我真的存在,也是因为你需要我。"/><br />
        <textarea id="txt2" cols="20" rows="5">如果我真的存在,也是因为你需要我。</textarea>
    </div>
    <div>
        <label><input type="radio" name="fruit" value="苹果" />苹果</label>
        <label><input type="radio" name="fruit" value="香蕉" />香蕉</label>
        <label><input type="radio" name="fruit" value="西瓜" />西瓜</label>
    </div>
    <p id="fruit"></p>
    <div>
        <p><label><input id="selectAll" type="checkbox"/>全选/反选:</label></p>
        <label><input type="checkbox" name="fruit1" value="苹果" />苹果</label>
        <label><input type="checkbox" name="fruit1" value="香蕉" />香蕉</label>
        <label><input type="checkbox" name="fruit1" value="西瓜" />西瓜</label>
    </div>

     <select id="list">
        <option value="http://wwww.baidu.com">百度</option>
        <option value="http://www.sina.com.cn">新浪</option>
        <option value="http://www.qq.com">腾讯</option>
        <option value="http://www.sohu.com">搜狐</option>
    </select>
    <br/>
    <br/>
    <input id="btn2" type="button" value="提交" />
</body>
</html>
#btn {
    display: inline-block;
    width: 80px;
    height: 24px;
    line-height: 24px;
    font-family:微软雅黑;
    font-size:15px;
    text-align: center;
    border-radius: 3px;
    background-color: deepskyblue;
    color: White;
    cursor: pointer;
}

#btn:hover {
    background-color: dodgerblue;
}

#search{
    color:#bbbbbb;
}