jQuery2

jQuery DOM 操作

$("#btn1").click(function(){
  alert("Text: " + $("#test").text()); //设置或返回所选元素的文本内容
});
$("#btn2").click(function(){
  alert("HTML: " + $("#test").html());  //设置或返回所选元素的内容
});
$("#btn1").click(function(){
  alert("Value: " + $("#test").val()); //获得输入字段的值
});
$("button").click(function(){
  alert($("#w3s").attr("href")); //获得链接中 href 属性的值
});

设置内容 - text()、html() 以及 val()

$("#btn1").click(function(){
  $("#test1").text("Hello world!");//设置或返回所选元素的文本内容

});
$("#btn2").click(function(){
  $("#test2").html("<b>Hello world!</b>");//设置或返回所选元素的内容（包括 HTML 标记）
});
$("#btn3").click(function(){
  $("#test3").val("Dolly Duck");//设置或返回表单字段的值
});
$("button").click(function(){
  $("#w3s").attr({
    "href" : "http://www.w3school.com.cn/jquery",
    "title" : "W3School jQuery Tutorial" //attr() 方法也允许您同时设置多个属性
  });
});

添加/删除元素

$("p").append("Some appended text."); //在被选元素的结尾插入内容
$("p").prepend("Some prepended text."); //在被选元素的开头插入内容
$("img").after("Some text after");//在被选元素之后插入内容。
$("img").before("Some text before");//在被选元素之前插入内容
$("#div1").remove();//删除被选元素及其子元素
$("#div1").empty();//删除被选元素的子元素

获取并设置 CSS 类

$("button").click(function(){
  $("h1,h2,p").addClass("css类");
  $("div").addClass("css类");
});
$("button").click(function(){
  $("#div1").addClass("important blue");//同时多个类
});
$("button").click(function(){
  $("h1,h2,p").removeClass("blue");//删除指定的 class 属性
});
$("button").click(function(){
  $("h1,h2,p").toggleClass("blue");//切换添加删除
});
$("p").css("background-color");//返回首个匹配元素的 background-color 值
$("p").css({"background-color":"yellow","font-size":"200%"});//设置或返回被选元素的一个或多个样式属性

尺寸

$("button").click(function(){
  var txt="";
  txt+="Width: " + $("#div1").width() + "</br>";
  txt+="Height: " + $("#div1").height();
  $("#div1").html(txt);
});
$("button").click(function(){
  $("#div1").width(500).height(500);
});

width() 方法设置或返回元素的宽度（不包括内边距、边框或外边距）；
height() 方法设置或返回元素的高度（不包括内边距、边框或外边距）；
innerWidth() 方法返回元素的宽度（包括内边距）；
innerHeight() 方法返回元素的高度（包括内边距）；
outerWidth() 方法返回元素的宽度（包括内边距和边框）；
outerHeight() 方法返回元素的高度（包括内边距和边框）；
outerWidth(true) 方法返回元素的宽度（包括内边距、边框和外边距）；
outerHeight(true) 方法返回元素的高度（包括内边距、边框和外边距）。