キャプチャ
コンテンツの取得–text()、html()、val()
DOM操作のための3つのjQueryメソッド:

text():選択した要素のテキスト内容

を設定または返す.

html():選択した要素の内容(HTMLタグを含む)を設定または返します.

val():フォームフィールドの値

を設定または返します.
例1.text()とhtml()メソッドでコンテンツを取得します.

<script>
$(document).ready(function(){
  $("#btn1").click(function(){
    alert("Text: " + $("#test").text());
  });
  $("#btn2").click(function(){
    alert("HTML: " + $("#test").html());
  });
});
script>
<p id="test">       <b>  b>   。p>
<button id="btn1">    button>
<button id="btn2">   HTMLbutton>

例2.val()メソッドで入力フィールドの値を取得します.

<script>
$(document).ready(function(){
  $("button").click(function(){
    alert("  : " + $("#test").val());
  });
});
script>

<p>  : <input type="text" id="test" value="    "</p>
<button>   button>

プロパティの取得–attr()
≪アクション｜Action｜ldap≫:属性値の取得
例リンクのhrefプロパティの値を取得する方法:

<script>
$(document).ready(function(){
  $("button").click(function(){
    alert($("#runoob").attr("href"));
  });
});
script>

<p><a href="http://www.runoob.com" id="runoob">    a>p>
<button>   href     button>

設定
設定内容–text(),html()およびval()

text():選択した要素のテキスト内容

を設定または返す.

html():選択した要素の内容(HTMLタグを含む)を設定または返します.

val():フォームフィールドの値

を設定または返します.
例

<script>
   $(document).ready(function(){
      $("#btn1").click(function(){
         $("#test1").text("Hello Nico");
      });
      $("#btn2").click(function(){
         $("#test2").html("
Hello Nico
");
      });
      $("#btn3").click(function(){
         $("#test3").val("Haha");
      });
   });
script>

<p id="test1">      。p>
<p id="test2">        。p>
<p>   : <input type="text" id="test3">p>
<button id="btn1">    button>
<button id="btn2">   HTMLbutton>
<button id="btn3">   button>

text()、html()およびval()のコールバック関数
コールバック関数には、2つのパラメータがあります.選択された要素リストの現在の要素の下付き文字と、元の(古い)値です.次に、使用する文字列を関数の新しい値で返します.
例

<script>
$(document).ready(function(){
  $("#btn1").click(function(){
    $("#test1").text(function(i,origText){
      return "   : " + origText + "    : Hello world! (index: " + i + ")"; 
    });
  });

  $("#btn2").click(function(){
    $("#test2").html(function(i,origText){
      return "  html: " + origText + "   html: Hello world! (index: " + i + ")"; 
    });
  });
});
script>

<p id="test1">ggp>
<p id="test2">hhp>
<button id="btn1">    /    button>
<button id="btn2">    /  HTMLbutton>

プロパティの設定-attr()
作用:属性値の設定/変更
例

<script>
$(document).ready(function(){
  $("button").click(function(){
     $("#th").attr("name"," Nico");
      alert($("#th").attr("name"));
  });
});
script>

<p><a href="#" id="th" name="hh">Helloa>p>
<button>   href  button>

attr()メソッドでは、複数のプロパティを同時に設定できます.
例複数のプロパティを設定します.

<script>
 $(document).ready(function(){
     $("button").click(function(){
        $("#ha").attr({
        "name":"Nico",    //    name
        "title":"qq"      //    title
        });
     $("#ha").text($("#ha").attr("title"));//       title         
     });
  });
script>

<p><a href="#" id="ha">Hello Nicoa>p>
<button>changebutton>

attr()のコールバック関数
例

<script>
$(document).ready(function(){
    $("button").click(function(){
        $("#ha").attr("href", function(i, origValue){
            return origValue + "/ditu";
            /* return "http://www.sohu.com";*/
        });
        /*$("#ha").attr("href","http://www.baidu.com");*/
    });
});
script>

<p><a href="http://www.baidu.com" id="ha">Hello Nicoa>p>

<button>   href  button>