11_JQuery高级

JQuery 高级

1. 动画

1. 三种方式显示和隐藏元素

1. 默认显示和隐藏方式

1. show([speed,[easing],[fn]])

1. 参数:

1. speed:动画的速度。三个预定义的值("slow","normal", "fast")或表示动画时长的毫秒数值(如:1000)

2. easing:用来指定切换效果,默认是"swing",可用参数"linear"

* swing:动画执行时效果是 先慢,中间快,最后又慢

* linear:动画执行时速度是匀速的

3. fn:在动画完成时执行的函数,每个元素执行一次。

2. hide([speed,[easing],[fn]])

3. toggle([speed],[easing],[fn])

2. 滑动显示和隐藏方式

1. slideDown([speed],[easing],[fn])

2. slideUp([speed,[easing],[fn]])

3. slideToggle([speed],[easing],[fn])

3. 淡入淡出显示和隐藏方式

1. fadeIn([speed],[easing],[fn])

2. fadeOut([speed],[easing],[fn])

3. fadeToggle([speed,[easing],[fn]])

2. 遍历

<ul id="city">

    <li>北京

    <li>上海

    <li>天津

    <li>重庆

</ul>

 1. js的遍历方式

* for(初始化值;循环结束条件;步长)

$(function () {

var city =$("#city li")

for(var a=0;a

alert( city[a].innerHTML)

}

})


2. jq的遍历方式

1. jq对象.each(callback)

1. 语法:

jquery对象.each(function(index,element){});

* index:就是元素在集合中的索引

* element:就是集合中的每一个元素对象

* this:集合中的每一个元素对象

2. 回调函数返回值:

* true:如果当前function返回为false,则结束循环(break)。

* false:如果当前function返回为true,则结束本次循环,继续下次循环(continue)

2. $.each(object, [callback])

3. for..of: jquery 3.0 版本之后提供的方式

for(元素对象 of 容器对象)

3. 事件绑定

1. jquery标准的绑定方式

* jq对象.事件方法(回调函数);

* 注:如果调用事件方法,不传递回调函数,则会触发浏览器默认行为。

* 表单对象.submit();//让表单提交

2. on绑定事件/off解除绑定

* jq对象.on("事件名称",回调函数)

* jq对象.off("事件名称")

* 如果off方法不传递任何参数,则将组件上的所有事件全部解绑

3. 事件切换:toggle

* jq对象.toggle(fn1,fn2...)

* 当单击jq对象对应的组件后,会执行fn1.第二次点击会执行fn2.....

* 注意:1.9版本 .toggle() 方法删除,jQuery Migrate(迁移)插件可以恢复此功能。

<script src="../js/jquery-migrate-1.0.0.js" type="text/javascript" charset="utf-8"></script>

5. 插件:增强JQuery的功能

1. 实现方式:

1. $.fn.extend(object)

$.fn.extend(

{

check:function () {

做业务

}

}

)

* 增强通过Jquery获取的对象的功能  $("#id")

2. $.extend(object)

* 增强JQeury对象自身的功能  $/jQuery

$.extend({

max:function (a,b) {

return a >=b ? a:b

},

    min:function (a,b) {

return a <=b ? a:b

}

})

var max =$.max(2,3);

alert(max)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,744评论 6 502
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,505评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 163,105评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,242评论 1 292
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,269评论 6 389
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,215评论 1 299
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,096评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,939评论 0 274
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,354评论 1 311
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,573评论 2 333
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,745评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,448评论 5 344
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,048评论 3 327
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,683评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,838评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,776评论 2 369
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,652评论 2 354