不写完不让回家的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()方法绑定事件

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

时间: 2024-10-16 20:13:21

不写完不让回家的JQuery的事件与动画的相关文章

jQuery 事件和动画

jQuery 事件和动画 上回说到jQuery的选择器,大家都应该知道了,jQuery的使用可以让我们少写很多的代码,达到一个轻量级的效果,那么既然都有选择器等等方便,那么事件的使用肯定也是不可能缺少的,另外还加入一系列的动画效果,下面我们一起来看看吧!! 事件处理 直接绑定指定事件,事件类型即方法名,支持click.focus.blur.submit等. $("#button").click(function(){ //script goes here }); 用on来绑定事件,of

第4章 jQuery的事件和动画(1)——事件篇

jQuery扩展了JavaScript的基本事件处理机制,极大增强了事件处理能力 一. jQuery的事件 1. $(document).ready(function(){})加载方式 再次回到window.onload和$(document).ready(function(){})的比较中,后者是jQuery最重要的事件函数. (1)执行时机 $(document).ready(function(){})是待DOM就绪时马上可以执行.不一位置这些元素已经完全下载完成.一个简单的例子就是:图片可

第4章 jQuery的事件和动画(二)

二. jQuery中的动画 动画在前面几章案例中是回避不了的问题.此处结合一些简便的写法稍作系统的分析. 1. show()和hide()(1)介绍——不用过多的介绍了jQuery最基本的方法.本质是某个html对象的display从none和显示之间切换的丰富过程.在display为none之前,jq会记住原来对象的显示方式.原来是inline,再次调用show()方法时,显示方式不变. 回到例4.1中FAQ的例子——(运行环境jQuery1.7.2) 1 $(document).ready(

jQuery之事件和动画

1.加载DOM $(document).ready(function(){ }) 简写形式: $(function(){ }) 事件绑定: 合成事件 事件冒泡 移除事件 JQuery中的动画 show()方法和hide()方法 fadeIn()方法和fadleOut()方法

JQuery中的事件以及动画

嘿嘿,今天学习了JQuery的事件以及动画,感觉即将学习完JQuery,在回忆起上周学习的JavaScript,感觉好多刚刚学习的知识点都记得模 糊啦,这个是很让失望的,这里只说明了一点,课是听过啦,但是没有好好的练习,于是就加快了刚学习的知识的遗忘力度.在一周的时间里学习了JavaScript, 那时间没感觉可得节奏很快,现在顿时发现课真的是快啦,我需要认真的对待,好好的在练习练习,而写发现最近的态度也有很大的问题,总是在赶今天学习的任 务,发现没有更多的时间去复习前面学习的知识,感觉还是有点

论文写完啦

已经自信到有点自大了,觉得自己的论文简直就是巨作,很完美.这次写论文我深刻体会到了完美的定义,不是天衣无缝,而是你竭尽所能的做到了最好.对我来说,我的论文就已经是完美了.可是,为什么都没人想看我的论文呢.我密了好几个人想不想看我的论文,都没回应.于是我专门改了QQ签名档.但我想还是没人会真的想看吧. 我太兴奋啦.看了下论文的word,创建日期是6/25,但我想再之前应该还是有一些草稿,不然20多天就从零到写完,也太厉害了.这期间,改了起码有三个版本.真的是天翻地覆的变化.其中又以这个礼拜的变化最

IP的计算------HDOJ杭电2206(写完脑洞大开,想象力要足够丰富)

Problem Description 在网络课程上,我学到了很多有关IP的知识.IP全称叫网际协议,有时我们又用IP来指代我们的IP网络地址,现在IPV4下用一个32位无符号整数来表示,一般用点分方式来显示,点将IP地址分成4个部分,每个部分为8位,表示成一个无符号整数(因此不需要用正号出现),如192.168.100.16,是我们非常熟悉的IP地址,一个IP地址串中没有空格出现(因为要表示成一个32数字). 但是粗心的我,常常将IP地址写错,现在需要你用程序来判断. Input 输入有多个c

自写图片遮罩层放大功能jquery插件源代码,photobox.js 1.0版,不兼容IE6

阿嚏~~~ 话说本屌丝没啥开发插件的经验,可是天公不作美,公司须要让我自己开发个图片放大的插件 但公司老大的话,宛如吾皇之圣旨,微臣必当肝脑涂地,莫敢不从啊~~~ 于是乎,作为一个超级小白,本人仅仅能瞎研究了,幸好黑天不负屌丝人,本屌丝最终搞出来了,尽管不尽善尽美,可是功能还是能够用的啦 先附上源代码,求各种大神指导: /******************************* * photobox跨浏览器兼容插件 v1.0(不支持IE6) * 格式:<a href="big.jpg

linux下安装codeblocks及写完程序之后编译成功但无法运行的原因

一:在软件中心输入codeblocks,然后点击安装,等着装完就行了. 再按ctrl+alt+t 打开终端 输入 sudo apt-get install gcc 而后再输入sudo apt-get install g++ 最后打开codeblocks写个 helloworld 试试吧. 二:helloworld小程序写完后,也编译通过了,但是却无法运行,那么你再看看保存的地方吧,要是不是保存在linux下的文档了,而是保存在磁盘里的话就是造成不能运行的结果了,更改保存位置试试看呗. 以上仅是我