jquery 基础

1 hide 按钮隐藏

id

. class p.class p#xxx

("[href]") href= href!=

("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。

2 css $("p").css("background-color","red");

hide("slow")

show

("p").hide(1000);

("p").toggle();

(selector).fadeIn(speed,callback);

(selector).fadeOut(speed,callback);

(selector).fadeToggle(speed,callback);

(selector).fadeTo(speed,opacity,callback);

3\

(selector).slideDown(speed,callback);

(selector).slideUp(speed,callback); $(selector).slideToggle(speed,callback);

4 animate

(selector).animate({params},speed,callback);

("button").click(function(){

("div").animate({left:'250px'}); });

("button").click(function(){

("div").animate({ left:'250px', opacity:'0.5', height:'150px', width:'150px' }); });

("button").click(function(){ $("div").animate({ left:'250px', height:'+=150px', width:'+=150px' }); });

callback $("p").hide(1000,function(){ alert("The paragraph is now hidden"); });

链式写法 $("#p1").css("color","red").slideUp(2000).slideDown(2000);

text() html() val() attr("href")

更改属性：

("button").click(function(){

("#w3s").attr({ "href" : "http://www.w3school.com.cn/jquery", "title" : "W3School jQuery Tutorial" }); });

("p").append("Some appended text.");

("p").prepend("Some prepended text.");

("img").after("Some text after");

("img").before("Some text before");

("#div1").remove();

("#div1").empty(); $("p").remove(".italic");

("button").click(function(){

("h1,h2,p").removeClass("blue"); });

("button").click(function(){

("h1,h2,p").toggleClass("blue"); });

("button").click(function(){

("h1,h2,p").addClass("blue"); $("div").addClass("important"); });

("p").css("background-color");

("p").css("background-color","yellow");

("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(){ var txt=""; txt+="Inner width: " +

("#div1").innerWidth() + "</br>"; txt+="Inner height: " +

("#div1").innerHeight();

("#div1").html(txt); });

("button").click(function(){ var txt=""; txt+="Outer width: " +

("#div1").outerWidth() + "</br>"; txt+="Outer height: " +

("#div1").outerHeight();

("#div1").html(txt); });

$("span").parent();

("span").parents();

("span").parents("ul"); $("span").parentsUntil("div");

$("div").children();

("div").children("p.1");

("div").find("span"); $("div").find("*");

("h2").siblings();

("h2").next();

("h2").nextAll();

("h2").nextUntil("h6"); jQuery prev(), prevAll() & prevUntil() 方法

("div p").first();

("div p").last();

("p").eq(1);

("p").not(".intro");