☰

Custom element hider

To show how one can hide elements like an ad blocker using userscripts

  1. // ==UserScript==
  2. // @name         Custom element hider
  3. // @namespace    https://zachsaucier.com/
  4. // @version      0.1
  5. // @description  To show how one can hide elements like an ad blocker using userscripts
  6. // @author       Zach Saucier
  7. // @match        *://*/*
  8. // @grant        none
  9. // ==/UserScript==
  10.  
  11. (function() {
  12.     'use strict';
  13.  
  14.     // Set our list of sites and elements to block
  15.     var blockList = [
  16.         "www.youtube.com###watch7-sidebar-contents",
  17.         "www.youtube.com##.yt-masthead-logo-container",
  18.         "www.facebook.com##._1uh-:nth-of-type(2)",
  19.         "www.facebook.com##._2t-e > ._4kny:nth-of-type(1)",
  20.         "www.facebook.com##._1uh-:nth-of-type(1)",
  21.         "www.facebook.com##._50tj._2t-a",
  22.         "www.facebook.com##._50ti._2s1y._5rmj._26aw._2t-a",
  23.         "www.facebook.com###u_0_0",
  24.         "www.facebook.com###fbDockChatBuddylistNub > .fbNubButton"
  25.     ];
  26.  
  27.     // Get the window's hostname
  28.     var windowHostname = window.location.hostname;
  29.  
  30.     // Iterate through the blocklist, hiding elements as needed
  31.     for(var i = 0; i < blockList.length; i++) {
  32.         var entryParts = blockList[i].split('##');
  33.  
  34.         // Compare the hostnames; Only remove elements if they match
  35.         if(windowHostname === entryParts[0]) {
  36.             // Find the elements if they exists
  37.             var matchedElements = document.querySelectorAll(entryParts[1]);
  38.  
  39.             // Actually remove the element(s) that match
  40.             for(var j = 0; j < matchedElements.length; j++) {
  41.                 var matchedElem = matchedElements[j];
  42.  
  43.                 matchedElem.parentNode.removeChild(matchedElem);
  44.             }
  45.         }
  46.     }
  47. })();