オブジェクトの操作その１（テキスト）

jQuery オブジェクトの操作

タグの中のテキストを文字列として取得したり変更したりするメソッドについて。

<html>
  <head>
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">google.load("jquery", "1.3.2");</script>
    <script type="text/javascript">
      $(function() {
        //取り出す。
        var div1 = $("#div1").text();
        var div2 = $("#div2").text();
        var div3 = $("#div3").text();
        //設定する。
        $("#div1").text(div2);
        $("#div2").text(div1);
        alert(div3);
        //更に#div3の中の#span1のテキストを変更してみるテスト。
      　$("#div3 #span1").text("保毛川保毛雄");
      })
    </script>
  </head>
  <body>
    <!-- テキストを取得したり設定したりするてすと -->
    <div id="div1">ぱんぱかぱんつ</div>
    <div id="div2">ぱんぱかぱん２</div>
    <!-- 指定したセレクタ中に更にタグがある場合はどうやらタグが無視されて、
　　　　　平文になったテキストが抽出される感じ -->
    <div id="div3">ぱんぱか<span id="span1">ぱんつで<span style="color: red; font-size: 20pt;">ぱんぱかぱん</span></span></div>
  </body>
</html>

ソース内にも記述したけど、#div1と#div2のテキストが入れ替わる。
また、#div3を指定すると、その内部にあるタグはすべて無視されて、抽出されたテキストだけが平文として取得できる。
内部にタグが存在するようなタグのテキストを差し替えると、元々あったタグも消えるみたいだ。まぁ普通のイメージで処理できるね〜。