jQuery 语法实例.docVIP

jQuery 语法实例 $(this).hide() 隐藏当前元素隐藏所有 id=test 的元素隐藏所有段落隐藏所有 class=test 的所有元素jQuery 属性选择器 jQuery 使用 XPath 表达式来选择带有给定属性的元素。 $([href]) 选取所有带有 href 属性的元素。 $([href=#]) 选取所有带有 href 值等于 # 的元素。 $([href!=#]) 选取所有带有 href 值不等于 # 的元素。 $([href$=.jpg]) 选取所有 href 值以 .jpg 结尾的元素。 $(this) 当前 HTML 元素 $(p) 所有 p 元素 $(p.intro) 所有 class=intro 的 p 元素 $(.intro) 所有 class=intro 的元素 $(#intro) id=intro 的元素 $(ul li:first) 每个 ul 的第一个 li 元素 $([href$=.jpg]) 所有带有以 .jpg 结尾的属性值的 href 属性 $(div#intro .head) id=intro 的 div 元素中的所有 class=head 的元素 结论 由于 jQuery 是为处理 HTML 事件而特别设计的，那么当您遵循以下原则时，您的代码会更恰当且更易维护： 把所有 jQuery 代码置于事件处理函数中 把所有事件处理函数置于文档就绪事件处理器中 把 jQuery 代码置于单独的 .js 文件中 如果存在名称冲突，则重命名 jQuery 库 jQuery 事件 $(document).ready(function) 将函数绑定到文档的就绪事件（当文档完成加载时） $(selector).click(function) 触发或将函数绑定到被选元素的点击事件 $(selector).dblclick(function) 触发或将函数绑定到被选元素的双击事件 $(selector).focus(function) 触发或将函数绑定到被选元素的获得焦点事件 $(selector).mouseover(function) 触发或将函数绑定到被选元素的鼠标悬停事件 jQuery hide() 和 show() 通过 jQuery，您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素： $(#hide).click(function(){ $(p).hide(); }); $(#show).click(function(){ $(p).show(); }); 语法： $(selector).hide(speed,callback); $(selector).show(speed,callback); 可选的 speed 参数规定隐藏/显示的速度，可以取以下值：slow、fast 或毫秒。 可选的 callback 参数是隐藏或显示完成后所执行的函数名称。 下面的例子演示了带有 speed 参数的 hide() 方法： 实例 $(button).click(function(){ $(p).hide(1000); }); jQuery toggle() 通过 jQuery，您可以使用 toggle() 方法来切换 hide() 和 show() 方法。 显示被隐藏的元素，并隐藏已显示的元素： 实例 $(button).click(function(){ $(p).toggle(); }); 语法： $(selector).toggle(speed,callback); 可选的 speed 参数规定隐藏/显示的速度，可以取以下值：slow、fast 或毫秒。 可选的 callback 参数是 toggle() 方法完成后所执行的函数名称。 jQuery 效果函数 方法 描述 animate() 对被选元素应用“自定义”的动画 clearQueue() 对被选元素移除所有排队的函数（仍未运行的） delay() 对被选元素的所有排队函数（仍未运行）设置延迟 dequeue() 运行被选元素的下一个排队函数 fadeIn() 逐渐改变被选元素的不透明度，从隐藏到可见 fadeOut() 逐渐改变被选元素的不透明度，从可见到隐藏 fadeTo() 把被选元素逐渐改变至给定的不透明度 hide() 隐藏被选的元素 queue()