jquery学习-01-基础篇

/*jquery语法* */$(this).hide(speed,callback) // 隐藏当前元素  可选的speed参数为“slow”，“fast”或者毫秒如“1000” ，callback回调函数。$("p").toggle()              // 切换   hide()和  show()方法$("p").hide()                // 隐藏所有 <p> 元素$("p.test").hide()           // 隐藏所有 class="test" 的 <p> 元素$("#test").hide()            // 隐藏所有 id="test" 的元素$(document).ready(function(){    //文档加载完之后运行的方法});$(function(){    //文档加载完之后的执行的方法同上个方法});/** jquery选择器* */$("*").hide();               //选取所有元素$(this)                      //选取当前元素$("ul li:first-child")       //选取ul的第一个li元素/*常用的jquery事件方法*/click();        //点击事件dbclick();      //双击事件mouseecter();   //鼠标指针穿过事件mouseleave();   //鼠标指针离开事件mousedown();    //当鼠标指针移动到元素上方，并按下鼠标按键时触发事件mouseup();      //当松开鼠标按钮时触发的事件hover();        //模拟光标悬停事件移动到元素上是触发mouseenter（），离开时触发mouseleave()focus();        //当元素获得焦点时触发focus事件（当通过鼠标点击或通过tab键定位到元素时钙元素就会获得焦点）blur();         // 当元素失去焦点时发生blur事件/** jquery效果** */ fadeIn(speed,callback)            //淡入 fadeOut(speed,callback)           //淡出 fadeToggle(speed,callback)        //切换淡入和淡出 fadeTo(speed,opacity,callback)    //允许规定不透明度 slideDoen(speed,callback)         //下滑 slideUp(speed,callback)           //上拉 slideToggle(speed,callback)       //切换下滑和上拉/** 动画 params 定义形成动画的css属性，对位置进行操作时* 要把元素的position属性设置为relative，fixed或absolute* 当使用 animate() 时，必须使用 Camel 标记法书写所有的属性名，* 比如，必须使用 paddingLeft 而不是 padding-left* 同时，色彩动画并不包含在核心 jQuery 库中。* 也可以定义相对值（该值相对于元素的当前值）。需要在值的前面加上 += 或 -=：* 您甚至可以把属性的动画值设置为 "show"、"hide" 或 "toggle"：* 这意味着如果您在彼此之后编写多个 animate() 调用，jQuery 会创建* 包含这些方法调用的"内部"队列。然后逐一运行这些 animate 调用。* exam：* $("button").click(function(){ var div=$("div"); div.animate({height:'300px',opacity:'0.4'},"slow"); div.animate({width:'300px',opacity:'0.8'},"slow"); div.animate({height:'100px',opacity:'0.4'},"slow"); div.animate({width:'100px',opacity:'0.8'},"slow"); });* */ $.animate({params},speed,callback); /* *jQuery stop() 方法用于停止动画或效果，在它们完成之前。  stop() 方法适用于所有 jQuery 效果函数，包括滑动、淡入淡出和自定义动画。  可选的 stopAll 参数规定是否应该清除动画队列。默认是 false，  即仅停止活动的动画，允许任何排入队列的动画向后执行。  可选的 goToEnd 参数规定是否立即完成当前动画。默认是 false。 * */ $(selector).stop(stopAll,goToEnd);/**有一种名为链接（chaining）的技术，允许我们在相同的元素上运行多条 jQuery 命令，一条接着另一条。 这样的话，浏览器就不必多次查找相同的元素。* */$("#p1").css("color","red").slideUp(2000).slideDown(2000);