JQuery 常用方法和属性

给jq 的$符号引用改为 $j 以便不与其他$符号冲突   var $j = jQuery.noConflict();

查找 ID 为"myDiv"的元素。$("#myDiv"); 

查找一个 DIV 元素。$("div"); 

查找含有特殊字符的元素 <span id="foo:bar"></span> ---> ${"#foo//:bar"}

<span id="foo[bar]"></span>  ---> ${"#foo//[bar//]"}

<span id="foo.bar"></span> ---> ${"foo//.bar"}

查找所有类是 "myClass" 的元素. $(".myClass"); 

查找所有 name 属性是 newsletter 的 input 元素 $("input[name='newsletter']").attr("checked", true); 

找到匹配任意一个类的元素。 $("div,span,p.myClass") 

找到表单中所有的 input 元素 $("form input") 

匹配表单中所有的子级input元素。$("form > input") 

查找表格的1、3、5...行（即索引值0、2、4...） $("tr:even") 

查找表格的2、4、6行（即索引值1、3、5...） $("tr:odd")

给页面内所有标题加上背景色 $(":header").css("background", "#EEE"); 

只有对不在执行动画效果的元素执行一个动画特效 $("#run").click(function(){

   $("div:not(:animated)").animate({ left: "+=20" }, 1000);}); 

查找所有包含 "John" 的 div 元素 $("div:contains('John')") 

查找所有含有 id 属性的 div 元素 $("div[id]") 

找到所有含有 id 属性，并且它的 name 属性是以 man 结尾的 $("input[id][name$='man']") 

查找所有密码框 $(":password")  

匹配type为hidden的元素 $("input:hidden") 

查找所有选中的复选框元素 $("input:checked") 

查找所有未选中的 input 元素 $("input:not(:checked)") 

查找所有选中的选项元素 $("select option:selected") 

返回文档中第一个图像的src属性值。<img src="test.jpg"/> ---> $("img").attr("src"); 

为所有图像设置src和alt属性。 $("img").attr({ src: "test.jpg", alt: "Test Image" }); 

为所有图像设置src属性。 $("img").attr("src","test.jpg"); 

将文档中图像的src属性删除 $("img").removeAttr("src"); 

为匹配的元素加上 selected highlight 类 <p class="selected highlight">Hello</p> ---> $("p").addClass("selected highlight"); 

从匹配的元素中删除 'selected' 类 $("p").removeClass("selected"); 

删除匹配元素的所有类 $("p").removeClass(); 

取得第一个匹配元素的html内容 $("div").html(); 

设置每一个匹配元素的html内容 $("div").html("<p>Hello Again</p>"); 

取得所有匹配元素的内容 $("p").text(); 

获取文本框中的值 $("input").val(); 

设置每一个匹配元素的值$("input").val("hello world!"); 

由于input元素的父元素是一个表单元素，所以返回true。 $("input[type='checkbox']").parent().is("form") 

查找DIV中的每个子元素。 $("div").children() 

在每个div中查找 .selected 的类。 $("div").children(".selected") 

取得第一个段落的color样式属性的值。 $("p").css("color"); 

如果属性名包含 "-"的话，必须使用引号: $("p").css({ "margin-left": "10px", "background-color": "blue" }); 

将所有段落字体设为红色 $("p").css("color","red"); 

获取文档的高 $(document).height(); 

把所有段落的高设为 20: $("p").height(20); 

获取当前窗口的宽 $(window).width(); 

将所有段落的宽设为 20: $("p").width(20); 

在DOM加载完成时运行的代码，可以这样写：$(document).ready(function(){// 在这里写你的代码...}); 

使用 $(document).ready() 的简写 jQuery(function($) {// 你可以在这里继续使用$作为别名...}); 

简写 $(function(){// 文档就绪}); 

当每个段落被点击的时候，弹出其文本。 $("p").bind("click", function(){ alert( $(this).text() );}); 

将页面内所有段落点击后隐藏。$("p").click( function () { $(this).hide(); }); 

鼠标悬停的表格加上特定的类 $("td").hover(

   function () {$(this).addClass("hover");}, //over (Function) : 鼠标移到元素上要触发的函数

  function () {$(this).removeClass("hover");} //out (Function) : 鼠标移出元素要触发的函数

); 

在每一个匹配元素的blur事件中绑定的处理函数。$("p").blur( function () { alert("Hello World!"); } ); 

给所有的文本框增加输入验证 $("input[type='text']").change( function() {// 这里可以写些验证代码}); 

当页面加载后将 id 为 'login' 的元素设置焦点: $(document).ready(function(){$("#login").focus();}); 

使人无法使用文本框: $("input[type=text]").focus(function(){ this.blur();}); 

当页面滚动条变化时，执行的函数: $(window).scroll( function() { } ); 

提交本页的第一个表单: $("form:first").submit(); 

如果你要阻止表单提交:  $("form").submit( function () {return false;} ); 

迭代两个图像，并设置它们的 src 属性。 $("img").each(function(i){this.src = "test" + i + ".jpg";}); 

注意:此处 this 指代的是 DOM 对象而非 jQuery 对象。

如果你想得到 jQuery对象，可以使用 $(this) 函数。$("img").each(function(){$(this).toggleClass("example");}); 

你可以使用 return false; 来提前跳出 each() 循环。 

计算文档中所有图片数量 $("img").size(); 等同于 $("img").length;