jQuery 事件操作

$( function(){} );和window.onload = function(){}的区别?

他们分别是在什么时候触发?
1、jQuery 的页面加载完成之后是浏览器的内核解析完页面的标签创建好 DOM 对象之后就会马上执行。
2、原生 js 的页面加载完成之后,除了要等浏览器内核解析完标签创建好 DOM 对象,还要等标签显示时需要的内容加载
完成。
他们触发的顺序?
1、jQuery 页面加载完成之后先执行
2、原生 js 的页面加载完成之后
他们执行的次数?
1、原生 js 的页面加载完成之后,只会执行最后一次的赋值函数。
2、jQuery 的页面加载完成之后是全部把注册的 function 函数,依次顺序全部执行

jQuery 中其他的事件处理方法:

click()
它可以绑定单击事件,以及触发单击事件
mouseover()
鼠标移入事件
mouseout()
鼠标移出事件
bind()
可以给元素一次性绑定一个或多个事件。
one()
使用上跟 bind 一样。但是 one 方法绑定的事件只会响应一次。
unbind()
跟 bind 方法相反的操作,解除事件的绑定
live()
也是用来绑定事件。它可以用来绑定选择器匹配的所有元素的事件。哪怕这个元素是后面动态创建出
来的也有效

    <script type="text/javascript">
      $(function () {
     
     
      
        //单击事件

        $("h5").click(function () {
     
     
          //传function是绑定事件
          // alert("你点击了");
        });
        //单击事件
        $("button").click(function () {
     
     
          //不传function是触发事件
          $("h5").click();
        });
        // 鼠标移入事件
        $("h5").mouseover(function () {
     
     
          console.log("你进来了");
        });
        //鼠标移出事件
        $("h5").mouseout(function () {
     
     
          console.log("你出去了");
        });
        //跟 bind 方法相反的操作,解除事件的绑定
        $("button").unbind("click");
        // 可以给元素一次性绑定一个或多个事件。
        $(".head").bind("click  mouseout", function (event) {
     
     
          if (event.type == "click") {
     
     
            $("<div>我被点击了</div>").appendTo(".head");
          } else {
     
     
            $("<span>我出去了</span>").appendTo(".head :last");
          }
        });

        //1.通常绑定事件的方式
        //2.jQuery提供的绑定方式:bind()函数
        //3.合并“鼠标移入”和“鼠标移出”事件
        //4.合并单击事件
        //5.切换元素可见状态
        //6.只绑定一次
      });
    </script>

前往jQuery 练习

猜你喜欢

转载自blog.csdn.net/qq_44788518/article/details/108248866