[解決済み] クラス名で要素を削除する?
2022-04-21 22:37:18
質問
以下のようなコードで、クラス名で要素を検索しています。
// Get the element by their class name
var cur_columns = document.getElementsByClassName('column');
// Now remove them
for (var i = 0; i < cur_columns.length; i++) {
}
ただ、削除の仕方がわからない......親を参照したりする必要があるのだろうか?どうすればいいのでしょうか?
@Karim79です。
以下はそのJSです。
var col_wrapper = document.getElementById("columns").getElementsByTagName("div");
var len = col_wrapper.length;
alert(len);
for (var i = 0; i < len; i++) {
if (col_wrapper[i].className.toLowerCase() == "column") {
col_wrapper[i].parentNode.removeChild(col_wrapper[i]);
}
}
以下はそのHTMLです。
<div class="columns" id="columns">
<div class="column"><input type="checkbox" name="col_list[]" value="cows">cows</div>
<div class="column"><input type="checkbox" name="col_list[]" value="cows">cows</div>
<div class="column"><input type="checkbox" name="col_list[]" value="cows">cows</div>
<div class="column"><input type="checkbox" name="col_list[]" value="cows">cows</div>
<div name="columnClear" class="contentClear" id="columnClear"></div>
</div>
編集する 結局、jQueryのオプションを使うだけでしたね。
解決方法は?
jQueryを使えば(この場合、本当に使ってもいいと思う)、こんな風にできる。
$('.column').remove();
そうでない場合は、各要素の親を使用して削除する必要があります。
element.parentNode.removeChild(element);
関連
-
[解決済み] JavaScriptで要素のクラスを変更するにはどうすればよいですか?
-
[解決済み] JavaScriptで配列の先頭に新しい配列要素を追加するにはどうすればよいですか?
-
[解決済み] 動的に生成された要素にイベントバインディングを行うか?
-
[解決済み] セルフクローズスクリプトエレメントが機能しないのはなぜですか?
-
[解決済み] 指定された要素にクラスを追加するには?
-
[解決済み] Javascriptで配列から空の要素を削除する
-
[解決済み] jQueryで名前を指定して要素を選択するには?
-
[解決済み] jQueryでドロップダウンリストの選択値を変更する
-
[解決済み】JavaScriptで配列の要素を削除する - delete vs splice
-
[解決済み】オブジェクトの型の名前を取得する
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Vue Element-uiは、アイコンを追加するためのツリーコントロールノードを詳細に実装しています。
-
vueのグローバルがscss(mixin)を導入。
-
[解決済み】JavaScriptでインラインIF文の書き方は?
-
[解決済み】React-Redux: アクションはプレーンオブジェクトでなければならない。非同期アクションにはカスタムミドルウェアを使用する
-
[解決済み】React Uncaught Error: 対象コンテナが DOM 要素でない [重複]。
-
[解決済み】リクエストに失敗していないのに、「TypeError: failed to fetch」が表示される。
-
HTML5 LocalStorage ローカルストレージとセッションストレージの使用法
-
nullのプロパティinnerHTMLを読み取れません エラーメッセージ
-
フロントエンド null のプロパティ 'disabled' を読み取れない 問題が解決された
-
モジュールのビルドに失敗しました。Error: ENOENT: no such file or directory, scandir 'D:\.... \node_modules