最新のWeb開発のチュートリアル
 

jQuery - コンテンツと属性を取得します。


jQueryのは、HTML要素や属性を変更し、操作するための強力なメソッドが含まれています。


jQueryのDOM操作

jQueryのの1つの非常に重要な部分は、DOMを操作する可能性です。

jQueryのは、要素と属性にアクセスして操作することが簡単にDOM関連のメソッドの束が付属しています。

DOM =ドキュメントオブジェクトモデル

DOMは、HTMLやXML文書にアクセスするための標準を定義しています。

「W3Cドキュメントオブジェクトモデル(DOM)は、プログラムとスクリプトが動的にアクセスし、文書の内容、構造、およびスタイルを更新することを可能にするプラットフォームや言語に依存しないインタフェースです。」


コンテンツを取得する- text(), html()およびval()

DOM操作のための3つの簡単な、しかし便利な、jQueryのメソッドは、次のとおりです。

  • text() -設定または選択した要素のテキストの内容を返します。
  • html() -設定または(HTMLマークアップを含む)選択した要素の内容を返します。
  • val() -設定またはフォームフィールドの値を返します。

次の例では、jQueryのでコンテンツを取得する方法を示しtext()html()メソッド:

$("#btn1").click(function(){
    alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
    alert("HTML: " + $("#test").html());
});
»それを自分で試してみてください

次の例では、jQueryを使って入力フィールドの値を取得する方法を示しval()メソッド:

$("#btn1").click(function(){
    alert("Value: " + $("#test").val());
});
»それを自分で試してみてください

属性を取得する- attr()

jQueryのattr()メソッドは、属性値を取得するために使用されます。

次の例は、の値を取得する方法を示しhrefリンク内の属性を:

$("button").click(function(){
    alert($("#w3s").attr("href"));
});
»それを自分で試してみてください

次の章では、(変化する)を内容と属性値を設定する方法について説明します。


練習で自分自身をテスト!

演習1» 演習2» 演習3» 演習4»


jQueryのHTMLリファレンス

すべてのjQuery HTML法の完全な概要については、当社をご覧くださいjQueryのHTML / CSSリファレンス