ホームページ > ウェブフロントエンド > フロントエンドQ&A > jqueryで指定された列を削除します

jqueryで指定された列を削除します

王林
リリース: 2023-05-08 22:00:08
オリジナル
730 人が閲覧しました

jQuery の人気により、jQuery を使用して Web 開発作業を完了することがますます便利になってきています。 Web テーブルでは、指定された列に対して操作を実行する必要がある場合がよくあります。これには、指定された列の削除が含まれます。ここではjQueryを使って指定した列を削除する方法を紹介します。

jQuery を使用して指定した列を選択する

指定した列を削除する前に、まず対象の列を選択する必要があります。 jQuery のオプションは非常に柔軟であり、実際のさまざまなニーズに応じてさまざまなオプションを選択して操作を完了できます。使用できるセレクターをいくつか示します。

  1. nth-child

このセレクターは、現在の要素の位置に基づいて子要素を選択します。特定の列を選択する場合は、テーブル ヘッダーの th 要素を選択し、nth-child メソッドを使用して、対応する列の td 要素を簡単に見つけることができます。メソッドは次のとおりです。

//删除第二列
$("tr td:nth-child(2)").remove();
ログイン後にコピー

nth-child は、対応するコンテンツではなく、サブ要素を指定します。ここでの 2 は、2 列目に対応する要素が削除されることを意味します。

  1. eq

eq メソッドを使用して、オプション セット内の指定されたインデックス位置に一致する要素を選択します。このメソッドのインデックスは 0 から始まります。例:

//删除第二列
$("tr td").eq(1).remove();
ログイン後にコピー

ここでの 1 は、nth-child メソッドと同様に、2 番目の列の位置を表します。 eq メソッドはインデックス位置を 0 からカウントし始めることに注意してください。

  1. filter

オプション コレクション内の不要な要素をフィルターします。フィルタリング メソッドは、カスタム関数またはセレクターで表されるルールを使用して操作できます。例:

//删除第二列
$("tr td").filter(":nth-child(2)").remove()
ログイン後にコピー

この例では、フィルター メソッドを使用して、削除する必要がある列を選択します。 params パラメーターでは任意の有効な jQuery セレクター メソッドを使用でき、その効果は nth-child と同じであることがわかります。

選択した列を削除します

削除する列を選択したら、次に削除を実行します。 jQuery の Remove メソッドを使用すると、この操作を簡単に完了できます。

//删除第二列
$("tr td:nth-child(2)").remove();
或者
$("tr td").eq(1).remove();
或者
$("tr td").filter(":nth-child(2)").remove();
ログイン後にコピー

これら 3 つのメソッドはすべて 2 番目の列を選択するため、remove メソッドの実行時にそれらを直接削除できます。

$("tr td:nth-child(2)").remove();
ログイン後にコピー

このようにして、指定された列は完全に削除され、表示されなくなります。ページ上で。

概要

jQuery のセレクター メソッドを使用すると、削除する必要がある列を簡単に選択できます。同時に、jQuery の Remove メソッドを使用すると、削除操作をより簡単に完了できます。この記事が、フロントエンドエンジニアの実際の業務の効率化や、より良い仕事能力の発揮に貢献できれば幸いです。

以上がjqueryで指定された列を削除しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート