js笔记2

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <!--<script >-->
    <!--document.write("我是用document.write输出的");-->
    <!--</script>-->
    <script src="myjs.js"></script>
    <link rel="stylesheet" type="text/css" href="js_715.css">

</head>
<body onload="msg()">
<div id="div" class="div" onmouseout="onOut(this)" onmouseover="onOver(this)">文字文字文字文字</div>

<script>

    function onOver(ooj) {
        ooj.innerHTML = "hello";
    }
    function onOut(ooj) {
        ooj.innerHTML = "world"
    }
</script>
<form>

    <input type="text" onchange="alert('做了改动')">
    <input type="text" onselect="changeDemo(this)" onfocus="changeDemo2(this)" onmouseout="changeDemo3(this)">
    <script>

        function changeDemo(bg) {

            bg.style.background = "red";
        }

        function changeDemo2(bg) {

            bg.style.background = "yellow";
        }

        function changeDemo3(bg) {

            bg.style.background = "white";
        }

        function msg() {
            alert("webpage content加载完毕")
        }

    </script>


</form>
<img id="imgid" src="1.jpg">
<a id="aid" href="http://www.baidu.com">网页跳转</a>
<button onclick="jump()">按钮</button>
<button onclick="jump2()">图片切换</button>
<button onclick="jump3()">换背景色</button>
<script>

    function jump() {
        document.getElementById("aid").href = "http://www.cisetech.com";
    }

    function jump2() {
        document.getElementById("imgid").src = "2.jpg";
    }

    function jump3() {
        document.getElementById("div").style.color = "pink";
    }
</script>
<button id="btn">我是按钮</button>
<script>
    document.getElementById("btn").addEventListener("click", function () {
        alert("hellolister")
    });
</script>

<button id="btn2">测试句柄</button>

<script>
var x=document.getElementById("btn2");
x.addEventListener("click",hello);
x.addEventListener("click",world);
x.removeEventListener("click",hello);
    function hello(){
        alert("hello");

    }
    function world(){
        alert("world")
    }

</script>
</body>
</html>
猜你喜欢
