jQuery

来源:互联网 发布:软件升级包 编辑:程序博客网 时间:2024/05/24 05:43

一 jQiery选择器


1 元素选择器:
$("p") 选取 <p> 元素。
$("p.intro") 选取所有 class="intro" 的 <p> 元素。

$("p#demo") 选取所有 id="demo" 的 <p> 元素。


2 属性选择器:
$("[href]") 选取所有带有 href 属性的元素。
$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。
$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。
$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。

3 CSS选择器:
$("p").css("background-color","red");把所有 p 元素的背景颜色更改为红色

4 更多选择器
$(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" 的元素

二 jQiery事件函数
$(document).ready(function) 将函数绑定到文档的就绪事件(当文档完成加载时)
$(selector).click(function) 触发或将函数绑定到被选元素的点击事件
$(selector).dblclick(function) 触发或将函数绑定到被选元素的双击事件
$(selector).focus(function) 触发或将函数绑定到被选元素的获得焦点事件
$(selector).mouseover(function) 触发或将函数绑定到被选元素的鼠标悬停事件


三 jQuery效果
语法: $(selector).anction(speed,callback);

jQuery隐藏和显示
  hide() 隐藏 show 显示 toggle()隐藏和显示切换 (其中这三个函数可带速度和回调函数参数)

jQuery淡入淡出(入:进入浏览器,出:出去流览器)
  fadeIn() 淡入 fadeOut 淡出 fadeToggle()淡入淡出切换 fadeTo() 淡的透明度to(0--1)
 
 $("#div3").fadeIn(3000);
 $("#div2").fadeOut("slow");
 $("#div3").fadeToggle(3000);
 $("#div3").fadeTo("slow",0.7);

jQuery 滑动效果
  slideDown() 向下滑动 slideUp() 向上滑动 slideToggle()向上向下滑动切换
0 0