zoukankan      html  css  js  c++  java
  • 不写完不让回家的JQuery的事件与动画

    在这看不见太阳的小黑屋里,苦逼的一天又开始了

    好了闲话我也就不扯了,接下来我就来说说我对jQuery事件和动画的理解吧!!!

    还是得再扯两句,我们敬爱的,Y老师讲完了,jQuery事件和动画,对着我们这听得一脸懵逼的人,说了一句不写完就别回家,心里咯噔一下,比被车撞都......

    一.jQuery中事件

    1.如何加载DOM呢?

      在常规的JavaScript代码中,我们通常使用window.onload方法对吧,而在jQuery中,使用的是$(document).ready()方法.$(document).ready()方法可以极大的提高Web应用程序的响应速度.

    2.执行的时机

      window.onload方法$(document).ready()方法有着相似的功能,但是在执行时机方面是有区别的.

    window.onload方法是在网页中所有的元素完全加载到浏览器后才执行,而通过jQuery中的$(document).ready()方法注册的时间处理程序,在DOM就绪时就可以被调用.

      简单的举一个例子,有一个大型的图库网站,为网页中虽有图片添加某些行为,例如单击图片后让他隐藏或显示.如果使用window.onload方法类来做处理,那么用户呢必须等到每一幅图片都加载完毕后,才可以进行小面的操作,但是如果使用jQuery中的$(document).ready()方法来进行设置,只要DOM就绪就可以进行操作了,不需要等待所有的图片下载完毕.

    结果呢很显然,不用我说你也知道是用哪一种速度快了吧!!!

    3.多次使用

    window.onload方法和$(document).ready()方法的区别

    $(function(){
                $(document).ready(function() {
                    alert("one");
                })
                $(document).ready(function () {
                    alert("two");
                })
            })
    window.onload = one;
    window.onload = two;

    这两个执行的结果是,第一个,两个会依次弹出,而第二个呢只会显示two.

    在悄悄的给你说个秘密,一般人不不告诉他

    第一种:

    $(document).ready(function () {
                //编写代码
    });

    第二种:

    $(function () {
        //编写代码
    });

    第三种:

    $().ready(function () {
        //编写代码
    });

    第二种是第一种的简写,不要崇拜我呦!!!

    可已根据自己的习惯书写

    4.事件如何绑定

    如果你打算为元素绑定事件来完成某些操作,那么你就可以用bind()方法来匹配元素进行特定的事件绑定.

    bind()方法的调用格式:

    bind(type[,data],fn);

    $("li").bind({
                        mouseover: function() {
                            $(this).css("background", "pink");
                        },
                        mouseout: function() {
                            $(this).css("background", "");
                        }
                    });
    
    //标签
    <body>
            <ul>
                <li>首页</li>
                <li>公司信息</li>
                <li>人才计划</li>
            </ul>
    </body>

    这个例子充分的说明了如何使用bind()方法绑定事件

    好了,这次就讲这么多,有什么讲的不好的,请多多指点,谢谢观看

  • 相关阅读:
    【CodeForces】[659C]Tanya and Toys
    【CodeForces】[659A]Round House
    高并发网络编程之epoll详解
    Linux写时拷贝技术(copy-on-write)
    5种服务器网络编程模型讲解
    5种服务器网络编程模型讲解
    当你输入一个网址的时候,实际会发生什么?
    error: std::ios_base::ios_base(const std::ios_base&)’是私有的
    C++和JAVA的区别
    为什么内联函数,构造函数,静态成员函数不能为virtual函数
  • 原文地址:https://www.cnblogs.com/shuaibin/p/5520886.html
Copyright © 2011-2022 走看看