jqueryでliの値を取得する方法

jQuery は、Web 開発に豊富な機能と使いやすさを提供する非常に人気のある JavaScript ライブラリです。一般的なアプリケーション シナリオの 1 つは、jQuery を使用して Web ページ内のリスト要素を操作し、各リスト項目 (li) の値を取得することです。

jQuery では、セレクターを使用して Web ページ内の要素を取得できます。リスト要素は通常、順序なしリスト (ul) または順序付きリスト (ol) を使用して実装され、各リスト項目は li 要素を使用して表されます。したがって、次のメソッドを使用してすべてのリスト項目要素を取得できます。

var lis = $("li"); // 获取所有li元素

上記のコードでは、$ 記号は jQuery のエイリアスで、jQuery オブジェクトを表すために使用され、「li」はセレクターです。式。すべての li 要素が選択されていることを示します。

すべてのリスト項目要素を取得した後、jQuery の各メソッドを使用して要素を走査し、その値を取得できます。次のサンプル コードは、各リスト項目要素を反復処理し、そのテキスト (値) を取得してコンソールに出力する方法を示しています。

$("li").each(function() {
  var text = $(this).text(); // 获取当前列表项的文本
  console.log(text); // 打印文本
});

上記のコードでは、 each メソッドを使用してすべての li 要素を反復処理しています。 。このトラバーサル関数では、 this キーワードは現在トラバースされているリスト項目要素を指します。 text メソッドを使用して、リスト項目のテキスト内容を取得できます。

リスト項目の他の属性 (ID、クラス名など) を取得する必要がある場合があります。 jQuery には、指定された属性の値を取得するための attr メソッドが用意されています。次のサンプル コードは、リスト アイテムの ID 属性値を取得する方法を示しています。

$("li").each(function() {
  var id = $(this).attr("id"); // 获取当前列表项的ID属性值
  console.log(id); // 打印ID值
});

上記のコードでは、attr メソッドを使用して、現在のリスト アイテム要素の ID 属性値を取得します。このメソッドを使用して、他のプロパティの値を取得できます。

つまり、jQuery のセレクターとトラバーサル関数を使用すると、Web ページ内のリスト項目要素を簡単に取得し、そのテキストやその他の属性の値を取得できます。これらの機能により、Webページ内のコンテンツをより柔軟に操作でき、より豊かなインタラクティブ効果を実現できます。

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