最終更新日:2019年09月25日jQueryのremove()メソッドを使ってHTMLの要素を削除する事ができます。jQuery初心者向けに簡単なサンプルコードと共に解説します。remove()メソッドで特定要素を削除する方法jQueryの「remove()メソッド」の基本書式は以下の通りです。●remove()メソッドの基本書式$("セレクター").remove()HTMLにテキストを追加する「remove()メソッド」の使い方について、実際のサンプルコードで動作を確認してみましょう。「jQuery_Sample1.html」をコピーして、任意の場所に保存して下さい。id=div2><p>コンテンツ2</p></div></body></html>--------------------サンプルコードのボタンをクリックすると、id属性の値が「div2」の段落が削除されますので、「コンテンツ2」というテキストが削除され、「コンテンツ1」というテキストのみ表示されます。「remove()メソッド」を使って、特定のスタイルを適用した要素を削除してみましょう。サンプルコードの「jQuery_Sample2.html」をコピーして、任意の場所に保存して下さい。#b20000;}</style></head><body><button>クリックして下さい</button><p>コンテンツ0です。class="sample1">コンテンツ1です。</p></body></html>--------------------removeメソッドの引数にクラス名やid名を指定すると、指定した要素を削除する事が可能です。サンプルコードでは、段落要素(p)の内クラス名「.sample1」が指定されている段落のみ削除しますのでボタンをクリックすると「コンテンツ1」のテキストが削除されます。「remove()メソッド」で複数の要素を削除する事ができます。サンプルコードの「jQuery_Sample3.html」をコピーして、任意の場所に保存して下さい。#006dd9;}</style></head><body><button>クリックして下さい</button><p>コンテンツ0です。class="sample1">コンテンツ1です。class="sample2">コンテンツ2です。id=sample3>コンテンツ3です。</p></body></html>--------------------サンプルのHTMLでは、三つスタイルを適用した段落とスタイルを適用していない段落があります。この内「.sample1」、「.sample2」、「.sample3」のスタイルを適用している段落を削除します。removeメソッドの引数に複数のクラスセレクタ名を指定すると、「コンテンツ1」、「コンテンツ2」、「コンテンツ3」が削除されます。渋谷区Tweetおすすめ記事jQueryのbeforeメソッドでHTML要素を追加する方法jQueryのbeforeメソッドでHTML要素を追加する方法jQueryのbefore()メソッドを使うと、指定した要素の前にコンテンツを挿入したり、HTML要素を移動する事...jQueryのtoggleメソッドで要素の表示を切り替える方法jQueryのtoggleメソッドで要素の表示を切り替える方法jQueryのtoggle()メソッドを使ってHTML要素の表示・非表示を切り替える方法について解説します。jQuery...jQueryのwrapAllメソッドでHTML要素を囲む方法jQueryのwrapAllメソッドでHTML要素を囲む方法jQueryのwrapAll()メソッドを使うとHTML要素を指定の要素で囲む事ができます。コーダーを募集します。運営会社|サイトマップ|利用規約|プライバシーポリシー|お問い合わせ|企業担当者様へインターノウスのプロエンジニアでは、ITエンジニア・IT技術者の上流工程求人や、転職・キャリアアップ情報を発信しています。プログラマ、SE、ネットワークエンジニア、ITコンサルなど上流、プロジェクトマネジメントを目指す全てのITエンジニアをサポートします。reserved.無料キャリア相談をする未経験からエンジニアを目指す。