jQuery の prev() メソッドはどのように機能するのでしょうか?-jsチュートリアル-php.cn

jQuery の prev() メソッドはどのように機能するのでしょうか?

王林

リリース： 2024-02-27 13:36:04

オリジナル

533 人が閲覧しました

jQuery の prev() メソッドはどのように機能するのでしょうか?

jQuery の prev() メソッドは、一致する要素セット内の各要素の直前の兄弟要素を取得するために使用されるメソッドです。このメソッドは、直前の兄弟要素、つまり前の兄弟要素のみを返します。以下では、具体的なコード例を使用して、jQuery の prev() メソッドがどのように機能するかを説明します。

まず、隣接する 3 つの div 要素を含む単純な HTML 構造を準備します。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery的prev()方法示例</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div id="div1">第一个div</div>
<div id="div2">第二个div</div>
<div id="div3">第三个div</div>

<script>
$(document).ready(function(){
  var prevElement = $('#div2').prev();
  console.log(prevElement.text());
});
</script>
</body>
</html>

ログイン後にコピー

上記のコードでは、jQuery ライブラリを使用し、ドキュメントがロードされた後に関数が実行されました。この関数では、id div2 の div 要素を選択し、prev() メソッドを使用して前の兄弟要素を取得します。最後に、取得した要素のテキスト内容をコンソールに出力します。

上記のコードを実行すると、コンソールに「最初の div」が出力されますが、これは prev() メソッドが prev を通じて div2 の前の兄弟要素、つまり div1 を取得しているためです。 () メソッド。div1 要素が取得され、そのテキスト内容が出力されます。

要約すると、jQuery の prev() メソッドは要素の前の兄弟要素を簡単に取得できるため、フロントエンド開発プロセス中の要素の配置と操作がより柔軟で便利になります。

以上がjQuery の prev() メソッドはどのように機能するのでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。