Q&A
Javaは関係ないですよね？タグを削除して下さい。
こんにちは。
JavaScriptに携わり始めて2か月ほどのレベルの者です。
タイトルの通りなのですが、うまくいかずつまずいてしまっています。
消したい<td>はこの位置にある<td>です。
JavaScript
1<table class="form_table"> 2 <tr class="group"> 3 <th>メイングループ</th> 4 <td> 5 <table class="update"> 6 <tbody> 7 <tr> 8 <td> 9 </td> 10 <td> 11 <button type="button" class="delete"> 12 </td> 13 <td class="button"> 14 </td> 15 </tr> 16 </table> 17 </td> 18
*コードの記述範囲広げました。
このテーブルの中の、真ん中にある<td>である<~class="delete">になっている<td>を
削除したいと思っています。
消したい部分のレイアウトは
現場名(-)(+)
という見え方で、真ん中にある(-)のボタンを特定の条件で削除したいと思っています。
この現場名やボタンの追加はJavaScriptでinsertCell()等を使用して行っており、jspでは<tr><td>は記述していません。
どのように記述すれば特定の<td>を削除することができるでしょうか。
初歩的な質問で恐れ入りますが、ご教授いただけると幸いです。
よろしくお願いいたします。
すいません。タグ消去しました。
回答はしてしまいましたが、yamabejpさんの仰っていることも一理あります。削除したいテーブルがどのような構造のテーブルなのかなるべく全文ご提示願います。行削除ならまだいいんですが、その中の1セルのみ削除だとレイアウト上のリスクが大きいです。
すいません。コード修正しました。全体の構造はこのような形になっています。
htmlもまだ全体とは言えないような・・・。機密情報が含まれているようでしたら＊＊＊やhogeなどを使って適当にマスクしてもらって構いません。また、現在組まれているjavascriptも追記いただいて良いですか？insertCell()も気になるので。
回答4件
0
JavaScriptのタグのみなので、通常のJavaScript APIの前提で回答しています。
ChildNode#remove
一番、楽なのは ChildNode#remove
ただし、IE11- 未対応なので Polyfill が必要です(MDN に Polyfill あり)。
Node.removeChild
後方互換性的には Node.removeChild
HTMLTableRowElement#deleteCell
最後に HTMLTableRowElement#deleteCell
ただし、この方法は HTMLTableCellElement#cellIndex を参照してから、tr要素ノードを検索して実行するので、前者2つよりも手間がかかります。
- HTMLTableCellElement - Web API インターフェイス | MDN
- HTMLTableRowElement - Web API インターフェイス | MDN
- Interface HTMLTableRowElement
- Interface HTMLTableCellElement
Re: Anon_tmr さん
投稿2017/09/04 01:38
編集2017/09/04 01:45
総合スコア18196
0
removeClass()は指定要素から指定のクラスのみを削除するものであり、要素自体は削除しません。
jQueryならremove()などが利用できます。詳しくは下記を参考に試してみてください。
投稿2017/09/04 01:22
編集2017/09/04 01:42総合スコア80892
0
自己解決
すいません！やりたいことをやるのにtdを削除できればいいなと思い質問させていただいていたのですが、
条件を設定して処理を分けるやり方で解決できました。削除ではなく念のためinnerHTML = ""；で空にする方法にしました。ご回答いただきありがとうございました。
投稿2017/09/05 00:22
総合スコア23
内容的には、yambejpさんの指摘が正解だったという事になると思うのですが、これは「自己解決」なのでしょうか。
自己判断ではありますが...
私のベストアンサーの選び方は「回答内容によって質問内容が解決できたか」解決できる回答内容が複数ある場合は「説明・例えが一番わかりやすい」ということで選んでいます。
今回の私の質問内容は「特定のtdを削除できる方法があればご教授お願いします。」です。
yambejpさんのご指摘はためになるアドバイスだと私も感じています。しかし「特定のtdを削除する方法・そのような方法はない」といったように、質問内容が解決できる直接的な内容ではないと判断しました。また、tdの内容を空にするという方法は頭にあり、方法もわかっていたということもあります。
ただ、「特定のtdを削除する方法はあるのか」ということが疑問であったため質問しました。
今回行いたかった処理で「tdを消してしまったほうが良いのではないか」と判断し、このような質問をしたのは私の知識や経験不足なので恐縮ですが…
正直このサイトにおけるベストアンサーの選択基準や自己解決として扱って良い内容などを私は細かく把握していなかったので今回は上記の個人的な判断基準で質問内容を解決済という形にしました。以上が判断基準です。よろしくお願いします。
質問に対して「直接的な解」と「気づきを得る為のアドバイス」があった場合、どちらを選択するか見解の相違があるのは分かります。
Anon_tmr さんは質問に対しての回答をベストアンサーとして選ぶスタンスなのですね。
> ただ、「特定のtdを削除する方法はあるのか」ということが疑問であったため質問しました。
それでしたら、削除する方法を提案した回答に何のレスポンスもないのはなぜでしょうか。
遅くなりました。申し訳ありません。
教えていただいたやり方で行ってみたのですが、エラーがでてしまっていました。
私の記述ミスだと思いますが、また改めて記述の仕方を再度質問して、回答を待つという時間をとるなら
効率が多少悪くてもとりあえず自分が頭に浮かんでるやり方で記述してレイアウトを整えて次の処理の記述に進んで機能を完成させたかったという思いがあり、レスポンスもせず作業を進めてしまっていました。
お時間割いて回答していただいたのに大変失礼しました。
あなたの回答
tips
プレビュー
