选择器 $(this).hide() 隐藏当前的 HTML 元素。 $("p").hide() 隐藏所有 <p> 元素。 $(".test").hide() 隐藏所有 class="test" 的元素。 $('#test').hide() 隐藏 id="test" 的元素。 事件 $('').click(function(){}) 单击事件 $('').dblclick(function(){}) 双击事件 $('').mouseenter(function(){}) 鼠标输入enter 确定事件 $('').mouseleave(function(){}) 鼠标离开事件 $('').mousedown(function(){}) 鼠标按下事件 $('').mouseup(function(){}) 鼠标抬起事件 $('').hover(function(){}) 鼠标滑过事件 $('').focus() 获得焦点事件 $('').blur() 失去焦点事件 显示、隐藏 hide() show() toggle() hide() 淡入淡出 fadeIn() fadeOut() 隐藏 fadeToggle() fadeTo('slow',0.2) 设置透明度 滑动 slideDown() 向下滑动的效果 slideUp() 向上滑动效果 slideToggle() 动画 animate() 停止动画 stop() 滑动 stop() 动画 带参数 HTML 获取 和属性 text() html() val() 获取并且设置内容 attr() 设置一个或多个属性值 获取 添加元素 、内容 append() 选取元素的末尾添加内容 插入多个内容 prepend() 选取元素开头添加内容 after() 之后 before() 在选取元素之前添加元素 after() 插入多个元素 function afterText() { var txt1="<b>I </b>"; // 使用 HTML 创建元素 var txt2=$("<i></i>").text("love "); // 使用 jQuery 创建元素 var txt3=document.createElement("big"); // 使用 DOM 创建元素 txt3.innerHTML="jQuery!"; $("img").after(txt1,txt2,txt3); // 在图片后添加文本 } 移除元素、内容 remove() 移除选取的元素 empty() 移除选取的所有子元素 remove() 过滤元素并移除 获取 和 设置 css addClass() 不同元素添加class属性 addClass() 添加多个类 removeClass 移除指定类 toggleClass () 添加删除类 css() 方法 css() 返回属性 css() 设置css属性 css() 设置多个css属性 尺寸 width() height() 返回指定元素的高和宽 innerWidth() innertHeight() 返回指定元素的 innert widht/height 包含内边距 outerWidht() outerHeight() 返回指定元素的 outer-widht、height 包含内边距和边框 width() height() document 和window $(document).ready(function(){ $("button").click(function(){ var txt=""; txt+="文档 width/height: " + $(document).width(); txt+="x" + $(document).height() + " "; txt+="窗口 width/height: " + $(window).width(); txt+="x" + $(window).height(); alert(txt); }); }); widht() height() 设置指定元素 widht 和 height 祖先 parent() 返回祖先元素 parnents() 返回索引祖先元素 parentssUntil() 返回 介于两者自检的祖先元素 $(document).ready(function(){ $("span").parentsUntil("div").css({"color":"red","border":"2px solid red"}); }); 后代 children() 返回子元素 可以加 过滤 find() 可以加过滤 同胞siblings siblings() 返回兄弟元素 next() 返回下一个兄弟元素 nextAll() 返回除了自己之外的所有元素 nextUntil() 返回 两者之间的兄弟元素 $(document).ready(function(){ $("h2").nextUntil("h6").css({"color":"red","border":"2px solid red"}); });