TECH I.S.

jQuery - コンテンツと属性を取得する


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


jQuery DOM操作

jQueryの非常に重要な部分の1つは、DOMを操作できることです。

jQueryには、要素や属性へのアクセスと操作を容易にするDOM関連のメソッドが多数付属しています。

DOM = ドキュメントオブジェクトモデルDOMは、HTMLおよびXMLドキュメントにアクセスするための標準を定義します。「ドキュメントオブジェクトモデル(DOM)は、プログラムやスクリプトがドキュメントのコンテンツ、構造、スタイルに動的にアクセスして更新できるようにする、プラットフォームおよび言語に依存しないインターフェイスです。」


コンテンツの取得 - text()、html()、およびval()

DOM操作のための3つのシンプルだが便利なjQuery メソッドは次のとおりです。

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

次の例は、jQuerytext()html()メソッドを使用してコンテンツを取得する方法を示しています。

$("#btn1").click(function(){   alert("Text: " + $("#test").text()); }); $("#btn2").click(function(){   alert("HTML: " + $("#test").html()); });

次の例は、jQueryval()メソッドを使用して入力フィールドの値を取得する方法を示しています。

$("#btn1").click(function(){   alert("Value: " + $("#test").val()); });

属性を取得 - attr()

jQueryattr()メソッドを使用して属性値を取得します。

次の例は、リンクのhref属性の値を取得する方法を示しています。

$("button").click(function(){   alert($("#techis").attr("href")); });

次の章では、コンテンツと属性の値を設定(変更)する方法について説明します。


jQuery HTMLリファレンス

すべてのjQuery HTMLメソッドの完全な概要については、jQuery HTML/CSSリファレンスを参照してください。



プログラミング学習を加速させる

プログラミングをプロの講師に教えてもらいませんか。

テックアイエスのプログラミングスクールは初心者も大歓迎です。年齢制限もありません。転職・副業に強く、挫折させない手厚いサポートで稼ぐ力を身につけましょう!

スクールの詳細