Google Chrome – Chrome Extension for Automatically Modifying HTML

google-chrome

Is there a chrome extension could modify html automatically?

For example, here is an annoying header. 

<header class="top-bar js-top-bar top-bar__network _fixed">

I would like chrome delete this header during rendering page.

Is there a chrome extension could do this job?

AutoReplaceHTML seems to be an option, although it does not support https.

Here is my TamperMonkey settings.

enter image description here

When I save the script, load an page, nothing has happened, the element to be deleted is still there.

enter image description here

If I copy & paste all this code, "Invalid" error shows up.

enter image description here

Best Answer

Yes, TamperMonkey is designed just for stuff like this. By default it doesn't do anything, but you can create custom scripts that will be run when opening websites that you specify. Here is an example script that will delete the element from your example:

// ==UserScript==
// @name         New Userscript
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @grant        none
// @include        http://*
// @include        https://*
// ==/UserScript==

(function() {
    'use strict';

    var elems = document.getElementsByClassName('top-bar__network');
    elems[0].parentNode.removeChild(elems[0]);
})();
Related Question