python自动化开发-[第十五天]-jquery

今日概要

　　1、javascript补充

　　2、jquery

1、javascript-DOM绑定事件

　　1、事件类型

onclick        当用户点击某个对象时调用的事件句柄。
ondblclick     当用户双击某个对象时调用的事件句柄。

onfocus        元素获得焦点。               练习：输入框
onblur         元素失去焦点。               应用场景：用于表单验证,用户离开某个输入框时,代表已经输入完了,我们可以对它进行验证.
onchange       域的内容被改变。             应用场景：通常用于表单元素,当元素内容被改变时触发.（三级联动）

onkeydown      某个键盘按键被按下。          应用场景: 当用户在最后一个输入框按下回车按键时,表单提交.
onkeypress     某个键盘按键被按下并松开。
onkeyup        某个键盘按键被松开。

onload         一张页面或一幅图像完成加载。

onmousedown    鼠标按钮被按下。
onmousemove    鼠标被移动。
onmouseout     鼠标从某元素移开。
onmouseover    鼠标移到某元素之上。
onmouseleave   鼠标从元素离开

onselect       文本被选中。
onsubmit       确认按钮被点击。

　　2、事件绑定方式

　　　　第一种：

<div >点我呀</div>

<script>
    function foo(self){           // 形参不能是this;
        console.log("点你大爷!");
        console.log(self);   
    }
</script>

　　　第二种：

<p >试一试!</p>

<script>

    var ele=document.getElementById("abc");

    ele.onclick=function(){
        console.log("ok");
        console.log(this);    // this直接用
    };

</script>

　　2、事件介绍

　　　　onload事件

　　　　　　onload 属性开发中只给 body元素加.这个属性的触发标志着页面内容被加载完成.应用场景: 当有些事情我们希望页面加载完立刻执行,那么可以使用该事件属性.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
//        因为html的加载顺序是从上到下,当执行dom命令的时候,后面的标签还未定义,所以会导致功能无法使用
        window.onload=function () {
            document.getElementsByTagName('h1')[0].style.color='red';
            document.getElementsByTagName('button')[0].onclick = function () {
                alert(123)
            }
        };
//            第二种方法:在body上绑定onload方法
        function run() {
            document.getElementsByTagName('h1')[0].style.color='red';
            document.getElementsByTagName('button')[0].onclick = function () {
                alert(123)
        }
    </script>
</head>
<body onload="run()">
<h1> 123</h1>
<button>click</button>
</body>
</html>

onload