预览加载中，请您耐心等待几秒...

jquery框架学习笔记.docx

预览
1/10
2/10
3/10
4/10
5/10
6/10
7/10
8/10
9/10
10/10

亲，该文档总共37页，到这已经超出免费预览范围，如果喜欢就直接下载吧～

下载提示 文本预览

如果您无法下载资料，请参考说明：

1、部分资料下载需要金币，请确保您的账户上有足够的金币

2、已购买过的文档，再次下载不重复扣费

3、资料包下载后请先用软件解压，在使用对应软件打开

框架学习笔记 Jquery框架学习: toggle(function(),function(),...)每次点击后依次调用函数。 如果点击了一个匹配的元素，则触发指定的第一个函数，当再次点击同一元素时，则触发指定的第二个函数，如果有更多函数，则再次触发，直到最后一个。随后的每次点击都重复对这几个函数的轮番调用。 可以使用unbind("click")来删除。 <script> $('img').toggle( function(){ this.src="../image/b.jpg"; }, function(){ this.src="../image/f.jpeg"; } ); </script> 点击切换图片效果。 <body> <imgsrc="../image/f.jpeg"id="imgId"> <imgsrc="../image/f.jpeg"> <imgsrc="../image/f.jpeg"> </body> <script> $('img').toggle( function(){ this.src="../image/b.jpg"; }, function(){ this.src="../image/f.jpeg"; } ); </script> 当有多张图片时，会自动进行隐式遍历。底层已经写好。 hover鼠标移入移出时进行切换。 一个模仿悬停事件（鼠标移动到一个对象上面及移出这个对象）的方法。这是一个自定义的方法，它为频繁使用的任务提供了一种“保持在其中”的状态。 当鼠标移动到一个匹配的元素上面时，会触发指定的第一个函数。当鼠标移出这个元素时，会触发指定的第二个函数。 $("td").hover( function(){ $(this).addClass("hover"); }, function(){ $(this).removeClass("hover"); } ); 鼠标移入和移出时分别触发相应的事件。 单击标题显示和隐藏内容。 <script> $('h1').toggle( function(){ $(this).next().hide(); }, function(){ $(this).next().show(); } ); </script> 4.next()取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。 这个函数只返回后面那个紧邻的同辈元素，而不是后面所有的同辈元素（可以使用nextAll）。 找到每个段落的后面紧邻的同辈元素中类名为selected的元素。 <p>Hello</p><pclass="selected">HelloAgain</p><div><span>AndAgain</span></div> $("p").next(".selected") hide()隐藏显示的元素。 $("p").hide()隐藏所有段落。 show()显示隐藏的匹配元素。 如果选择的元素是可见的，这个方法将不会改变任何东西。无论这个元素是通过hide()方法隐藏的还是在CSS里设置了display:none;，这个方法都将有效。 <pstyle="display:none">Hello</p> $("p").show() 7.click()在每一个匹配元素的click事件中绑定一个处理函数。 点击事件会在你的指针设备的按钮在元素上单击时触发。单击的定义是在屏幕的同一点触发了mousedown和mouseup.几个事件触发的顺序是：mousedownmouseupclick $("p").click(function(){$(this).hide();}); 将页面内所有段落点击后隐藏。 parent()取得一个包含着所有匹配元素的唯一父元素的元素集合。 <div><p>Hello</p><p>Hello</p></div> $(“p”).parent(); 查找每个段落的父元素。 <div><p>Hello</p></div><divclass="selected"><p>HelloAgain</p></div> $("p").parent(".selected") 查找段落的父元素中每个类名为selected的父元素。 9.prev()取得一个包含匹配的元素集合中每一个元素紧邻的前一个同辈元素的元素集合。 可以用一个可选的表达式进行筛选。只有紧邻的同辈元素会被匹配到，而不是前面所有的同辈元素。 <p>Hello</p><div><span>HelloAgain</span></div><p>AndAg