jQueryでテキストを取得する方法-フロントエンドQ&A-php.cn

jQueryでテキストを取得する方法

WBOY

リリース： 2023-05-24 21:46:37

オリジナル

1855 人が閲覧しました

jQuery は、JavaScript の記述を簡素化し、開発者が HTML ドキュメント内の要素やコンテンツを操作しやすくする、広く使用されている JavaScript ライブラリです。一般的なニーズの 1 つは、HTML ドキュメント内のテキストコンテンツを取得することです。この記事では、jQuery でテキストを取得する 2 つの一般的な方法を紹介します。

1. text() メソッド

text() メソッドは、要素のテキストコンテンツを取得するために使用できる jQuery の組み込みメソッドです。このメソッドを使用すると、HTML ドキュメント内の任意の要素のテキスト情報を簡単に取得できます。以下は、要素のテキスト情報を取得する方法を示す簡単な例です。

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>jQuery text()方法演示</title>
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
  <div id="test">这是一个例子</div>
  <script>
    var text = $('#test').text();
    alert(text);
  </script>
</body>
</html>

ログイン後にコピー

この例では、最初に jQuery ライブラリを導入し、次に ID「test」を持つ div 要素を作成しました。そして、text() メソッドを使用してテキストコンテンツを取得し、結果を text という名前の変数に保存します。最後に、ポップアップウィンドウが呼び出されて、この変数の値が画面に出力されます。

2. html() メソッド

text() メソッドに加えて、要素の HTML コンテンツを取得するために使用できる html() というメソッドもあります。このメソッドと text() メソッドの違いは、すべてのラベルやテキストなど、要素テキスト以外のコンテンツを取得できることです。以下に、html() メソッドを使用して要素の HTML コンテンツを取得する方法を示す簡単な例を示します。

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>jQuery html()方法演示</title>
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
  <div id="test"><b>这是</b>一个例子</div>
  <script>
    var html = $('#test').html();
    alert(html);
  </script>
</body>
</html>

ログイン後にコピー

この例では、ID が「test」の div 要素を作成します。タグとテキスト。 html() メソッドを使用して HTML コンテンツを取得し、結果を html という変数に保存します。最後に、ポップアップウィンドウが呼び出されて、この変数の値が画面に出力されます。

概要

上記は、テキストを取得する 2 つの一般的なメソッドです。text() メソッドと html() メソッドはどちらも jQuery の組み込みメソッドです。これらを使用すると、テキストを簡単に取得できますHTML ドキュメント内: 任意の要素のテキストまたは HTML コンテンツ。 jQuery コードを記述するときは、実際のニーズに基づいて適切な方法を選択する必要があります。テキストコンテンツのみが必要な場合は text() メソッドを使用でき、ラベルやテキストを含む要素のコンテンツ全体を取得する必要がある場合は html() メソッドを使用できます。

以上がjQueryでテキストを取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。