jqueryでdivを除外する方法

jQuery を使用して HTML ページを操作する場合、特定の要素を除外する必要がある状況がよく発生します。要素を除外する方法はたくさんありますが、この記事ではjQueryを使ってdiv要素を除外する方法を例を交えて紹介します。

1. 基本構文

jQuery では、not() メソッドを使用して特定の要素を除外できます。 not() メソッドはセレクターをパラメーターとして受け取り、一致する要素のセットから不要な要素を除外できます。

基本的な構文は次のとおりです。

$(selector).not(selector)

このうち、最初の selector パラメータは操作対象の要素のセレクタ、2 番目の selector パラメータは操作対象の要素のセレクタです。除外されます。

2. 単一の div 要素を除外する

まず簡単な例を見てみましょう。次の HTML コードがあるとします。

<div class="wrapper">
  <div class="box">Box 1</div>
  <div class="box">Box 2</div>
  <div class="box">Box 3</div>
  <div class="box excluded">Box 4</div>
  <div class="box">Box 5</div>
</div>

次に、クラス「excluded」を持つ div 要素の 1 つを除外し、他の要素のみを操作する必要があります。次のコードを使用できます。

$('.box').not('.excluded').css('background-color', 'gray')

上記のコードでは、まずセレクター ".box" を使用してクラス "box" を持つすべての div 要素を選択し、次に not() メソッドを使用して次の div を除外します。クラス「除外」要素。最後に、 css() メソッドを使用して、これらの要素の背景色をグレーに設定します。

3. 複数の div 要素を除外する

単一の div 要素を除外するだけでなく、複数の要素を除外することもできます。次の HTML コードを考えてみましょう:

<div class="wrapper">
  <div class="box">Box 1</div>
  <div class="box">Box 2</div>
  <div class="box">Box 3</div>
  <div class="box excluded">Box 4</div>
  <div class="box">Box 5</div>
  <hr>
  <div class="panel">Panel 1</div>
  <div class="panel">Panel 2</div>
  <div class="panel">Panel 3</div>
  <div class="panel excluded">Panel 4</div>
  <div class="panel">Panel 5</div>
</div>

次に、div であろうと他の要素であろうと、クラス「excluded」を持つすべての要素を除外する必要があります。次のコードを使用できます。

$('*').not('.excluded').css('color', 'red')

上記のコードでは、ワイルドカード "*" を使用してすべての要素を選択し、次に not() メソッドを使用してクラス "excluded" の要素を除外し、最後にcss() メソッドを使用してこれらの要素の要素を削除し、テキストの色を赤に設定します。ワイルドカードを使用すると、ページ上のすべての要素が操作されるため、本当に必要な場合にのみ使用することに注意してください。

4. 概要

この記事では、jQuery で div 要素を除外する方法を紹介します。 not() メソッドを使用すると、一致した要素セットから不要な要素を除外し、必要な要素に対する操作を実現できます。除外ルールは 1 つ以上の要素のセレクターである場合もあれば、ワイルドカードである場合もあることに注意してください。実際の使用では、不要な影響を避けるために、特定の状況に応じて適切な方法を選択する必要があります。

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