はてなブログのトップページで不快な思いをしない方法

はてなブログのトップページに表示されるおすすめ記事とかいう奴、はっきり言ってめちゃくちゃ不快でクッソ邪魔です。

で、それを消しちゃう方法を書いてあげます。

これと似た感じですね。

おすすめ記事の部分はsection要素でクラス名がserviceTop-recommendになっています。今回はついでにカテゴリー(クラス名serviceTop-category)、週刊はてなブログ(serviceTop-weeklyHatenaBlog)、ブログタイムマシーン(serviceTop-backIn)も消します。

document.querySelector()にremove()を繋げて消していきたいと思います。

まず最初はCSSでやっていきます。

section要素でかつクラス名がserviceTopで始まる要素を消したいので、セレクタはsection[class^=serviceTop]としたいところですが、クラス名がserviceTop-startHatenablogのところは何となく消したくないので、:not(.serviceTop-startHatenablog)を繋げてsection[class^=serviceTop]:not(.serviceTop-startHatenablog)にします。

いい感じになったので、セレクタはsection[class^=serviceTop]:not(.serviceTop-startHatenablog)でいいでしょう。

これをdocument.querySelector()にぶち込んでremove()で消していきます。下のコードをWebコンソールに流し込みましょう。因みにこれではおすすめ記事の部分しか消えません。

document.querySelector()は引数にしたセレクタで一番最初に一致したものを返してくるので、この場合serviceTop-recommendのが返ってきて、それだけが削除されたんじゃないでしょうか。

最初のひとつではなく、すべて取得するにはdocument.querySelectorAll()を使います。NodeListなるもので返ってくるそうですね。というわけで、直接remove()を繋げられないのでこう書きます。

これで思ったように動きます。

それで、UserScriptはこうなります。

これではてなブログを安心して使えるから、また暫くはてなブログを使うのもいいかもしれませんね。