ホームページ  >  記事  >  ウェブフロントエンド  >  jQuery がテキストを取得するための text()/val()/html() メソッドの違い

jQuery がテキストを取得するための text()/val()/html() メソッドの違い

WBOY
WBOYオリジナル
2016-05-16 18:09:56961ブラウズ

jquery では、val、text、html はすべて値を取得したり、パラメータを追加して値を割り当てたりすることができます。では、これらの違いは何でしょうか。
まず、2 つのメソッドがあります。 html 属性で、1 つはパラメータを持ち、もう 1 つはパラメータを持たない
1. パラメータなし html (): 最初に一致した要素の HTML コンテンツを取得します。この関数は XML ドキュメントでは使用できません。ただし、文字列
を返す XHTML ドキュメントに使用できます。 例:
html ページ コード:

Hello


jquery コード: $( "div").html();
結果: Hello
2. パラメータ html (val): 一致する各要素の HTML コンテンツを設定します。この関数は XML ドキュメントでは使用できません。ただし、XHTML ドキュメントには使用できます。 jquery オブジェクトを返す
html ページ コード:

jquery コード: $("div").html("

初めまして

") ;
結果: [

初めまして

]

2 番目に、パラメータを含む 2 つのメソッドがあります。パラメータなしの 1 つ
1. パラメータなし text(): 一致するすべての要素の内容を取得します。結果は、一致するすべての要素に含まれるテキスト コンテンツを結合したテキストになります。返されるのは文字列です
例:
html ページ コード:

こんにちは


ありがとうございます!

;
jquery code: $("p").text();
Result: HellofineThankyou!

2. パラメータのテキスト (val) を html で設定します。 ( ) は似ていますが、HTML をエンコードします (「<」と「>」を対応する HTML エンティティに置き換えます)。jquery オブジェクト
HTML ページ コード:

Test Paragraph.

を返します。
jquery コード: $("p").text("一部 新しいテキスト。");
結果:[

一部 new text.

]

最後に、val() 属性には 2 つのメソッドがあり、1 つはパラメータ付きで、もう 1 つはパラメータなしです。
1. パラメーターなしの val(): 最初に一致した要素の現在の値を取得します。 jQuery 1.2 では、任意の要素の値を返すことができます。セレクトも含めて。複数の選択が行われた場合は、選択された値を含む配列が返されます。
は文字列、配列を返します
例:
html ページ コード:

コードをコピー コードは次のとおりです以下:




html ページ コードを返すこともできます。
: $(" input").val("hello world!");
結果: hello world!
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。