欢迎访问web记录!每一步的成长都是一种幸福,聪明的女孩擅长记录幸福!
您现在的位置:web记录 > 前端开发 > Jquery >

jQuery语法

更新时间:2013-09-15 浏览次数:

jQuery语法是为HTML元素的选取编制的,可以对元素执行某些操作

基础语法是:

$(selector).action()

*  美元符号定义jQuery

*  选择符(selector)"查询"和"查询"HTML元素、

*  jQuery的action()执行对元素的操作

示例

$(this).hide() //隐藏当前元素

$("p").hide()  //隐藏所有段落

$("p.test").hide() //隐藏所有 class="test"的段落

$("#test").hide()  //隐藏所有 id="test"的无素

文档就绪函数

您也许已经注意到在我们的实例中的所有jQuery函数于一个document ready函数中:

$(document).ready(function(){

---jQuery functions go here---

});

这是为了防止文档在完全加载之前运行jQuery代码

————————————————————————————————————————

jQuery隐藏和显示

$(selector).hide(speed.callback)

$(selector).show(speed.callback)

*  speed参数规定显示或隐藏的速度。可以设置这些值:"slow","fast","normal"或毫秒。

*  callback参数是在hide或show函数完成之后被执行的函数名称。

————————————————————

jQuery切换

jQuery toggle()函数使用show()或hide()函数来切换html元素的可见状态

$(selector).toggle(speed,callback)

*  speed参数可以设置这些值:"slow", "fast","normal"或毫秒

————————————————————

jQuery滑动函数- slideDown, slideUp, slideToggle

$(selector).slideDown(speed,callback)

$(selector).slideUp(speed,callback)

$(selector).slideToggle(speed,callback)\

*  speed参数可以设置这些值:"slow","fast","normal"或毫秒

*  callback参数是在该函数完成之后被执行的函数名称。

—————————————————————

jQuery Fade函数-fadeIn(),fadeOut(),fadeTo()

jQuery拥有以下fade函数

$(selector).fadeIn(speed,callback)

$(selector).fadeOut(speed,callback)

$(selector).fadeTo(speed,callback)

*   speed参数可以设置这些值:"slow","fast","normal"或毫秒

*   fadeTo()函数中的opacity参数规定减弱到给定的不透明度

*   callback参数是在该函数完成之后被执行的函数名称

——————————————————————

jQuery自定义动画

$(selector).animate({params},[duration],[easing],[callback])

*   关键的参数是params. 它定义产生动画的css属性。可以同时设置多个此类属性:

animate({width:"70%",opacity:0.4,marginLeft:"0.6in",fontSize:"3em"});

*第二个参数是duration.它定义用来应用到动画的时间。它设置的值是:"slow","fast","normal"或毫秒

_____________________________________________

jQuery效果

函数

$(selector).hide()        //隐藏被选元素

$(selector).show()        //显示被先元素

$(selector).toggle()      //切换(在隐藏与显示之间)被选元素

$(selector).slideDown()   //向下滑动(显示)被选元素

$(selector).slideUp()     //向上滑动(隐藏)被选元素

$(selector).slideToggle() //对被先元素切换向上滑动和向下滑动

关键词:

+ 相关信息

前端案例

返回顶部 欢迎访问web记录!每一步的成长都是一种幸福,聪明的女孩擅长记录幸福!