jquery 记录

jquery 值:

 

text(),html(),val().

 

.attr("href")

 

 $("#test1").text("Hello world!");

 $("#test2").html("<b>Hello world!</b>");

 $("#test3").val("Dolly Duck");

 

  $("#btn3").click(function(){

    $("#test3").val("Dolly Duck");

  });

 

====================

 $("#btn1").click(function(){

    $("#test1").text(function(i,origText){

      return "Old text: " + origText + " New text: Hello world! (index: " + i + 

 

")"; 

    });

  });

 

  $("#btn2").click(function(){

    $("#test2").html(function(i,origText){

      return "Old html: " + origText + " New html: Hello <b>world!</b> (index: 

 

" + i + ")"; 

    });

  });

======================

 $("#w3s").attr("href","http://www.w3school.com.cn/jquery");

  

//多属性

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

  $("#w3s").attr({

    "href" : "http://www.w3school.com.cn/jquery",

    "title" : "W3School jQuery Tutorial"

  });

});

 

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

  $("#w3s").attr("href", function(i,origValue){

    return origValue + "/jquery";

  });

});

 

=========================

 

append() - 在被选元素的结尾插入内容

prepend() - 在被选元素的开头插入内容

after() - 在被选元素之后插入内容

before() - 在被选元素之前插入内容

 

==========================

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

 

var txt1="<p>Text.</p>";               // 以 HTML 创建新元素

var txt2=$("<p></p>").text("Text.");   // 以 jQuery 创建新元素

var txt3=document.createElement("p");  // 以 DOM 创建新元素

txt3.innerHTML="Text.";

$("p").append(txt1,txt2,txt3);  

 

==========================

$("img").after(txt1,txt2,txt3); 

==========================

 

$("#div1").remove();

 

$("#div1").empty();

 

下面的例子删除 class="italic" 的所有 <p> 元素：

$("p").remove(".italic");

 

===========================

 

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

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

  $("div").addClass("important");

});

您也可以在 addClass() 方法中规定多个类：

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

  $("#div1").addClass("important blue");

});

 

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

 

该方法对被选元素进行添加/删除类的切换操作：

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

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

});

 

======================

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

 

//设置

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

///

 

$("p").css({"background-color":"yellow","font-size":"200%"});

 

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

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

 $("span").parents();

 $("span").parent();

========================

 $("div").children("p.game"); p元素，game 类

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

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

 $("h2").next();

 $("h2").nextAll(); 同级

 

===================

下面的例子选取首个 <div> 元素内部的第一个 <p> 元素：

 $("div p").first(); 

 

 $("div p").last();

 

 $("p").eq(1); //第二个元素

返回带有类名 "intro" 的所有 <p> 元素：

 $("p").filter(".intro"); 

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

============================

$("#div1").load("demo_test.txt");

$("#div1").load("demo_test.txt #p1");