ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript 拡張チュートリアル - jQuery - コンテンツと属性の取得

JavaScript 拡張チュートリアル - jQuery - コンテンツと属性の取得

黄舟
黄舟オリジナル
2017-01-21 15:58:051190ブラウズ

この記事は、H5EDU 組織の公式 HTML5 トレーニング チュートリアルです。主に次の内容を紹介します: JavaScript 拡張チュートリアル - jQuery - コンテンツと属性の取得

jQuery には、HTML 要素と属性を操作する強力な方法があります。

jQuery DOM 操作

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

jQuery は、要素や属性へのアクセスと操作を容易にする DOM 関連のメソッドのセットを提供します。

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

DOM は、HTML および XML ドキュメントにアクセスするための標準を定義します。

「W3C ドキュメント オブジェクト モデルは、プログラムとスクリプトがドキュメントに動的にアクセスして更新できるようにする、プラットフォームおよび言語に依存しないインターフェイスです。

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

DOM 操作用の 3 つのシンプルで実用的な jQuery メソッド:

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

次の例は、jQuery text() メソッドと html() メソッドを渡して、内容:

Instance

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


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

Instance

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


属性の取得 - attr()

jQuery attr() メソッド属性値を取得します。

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


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

上記は、JavaScript 拡張チュートリアル - jQuery - コンテンツと属性の取得です。その他の関連コンテンツについては、注意してください。 PHP 中国語 Web サイト (www.php.cn) にアクセスしてください。


声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。