jQueryを使って今見ているページのテーブルの特定の列を消す

管理画面なんかのHTMLを見ていると、テーブルで書かれたデータの特定の行を消して見たいことがある(そもそもUI的にイケてないってことなんだけど...)。 テーブルに限らないけど、特定のDOMを消したい場合どうするか。

最近なら document.querySelector() 使えば簡単にできるのかな?最近のJavaScript詳しくなくて分からないが、ひとまずjQueryで解決する。

まずjQueryをページに動的にロードする。

var script = document.createElement("script");
script.src = "https://code.jquery.com/jquery-latest.min.js";
document.body.appendChild(script);

あとはjQueryセレクタ使って検索して remove()を呼ぶ。

2個めのテーブルの7列目を消す

$("table:eq(1) tr").find("th:eq(6), td:eq(6)").remove();

2個めのテーブルの7列目から13列目までを消す

$("table:eq(1) tr").find("th:gt(6):lt(13), td:gt(6):lt(13)").remove();

参考

Load javascript via Firebug console - Stack Overflow

jQuery remove table column (by column number) — SitePoint

【jQuery】要素を指定するセレクタの使い方 まとめ | Web制作会社スタイル