Tampermonkey script runs until page loads

Question

I need to hide the section from the html page:

<h1 data-ng-show="!menuPinned &amp;&amp; !isSaaS" class="logo floatLeft" aria-hidden="false"><span>XXX&nbsp;</span><span style="font-weight: bold;">XXX&nbsp;</span><span>XXXXX</span></h1>

The following code works fine in Chrome dev. tools

var ibmlogo = document.querySelectorAll('h1.logo.floatLeft');
ibmlogo[1].remove();

But when I load the page with the active script, the section (h1) will not disappear. I believe this is because when the script is running, the DOM is not finished yet, so the script cannot find the selector.

I tried many different things (e.g. window.onLoad), but my script is not efficient. The last attempt (unsuccessful) is as follows:

var logo = document.querySelectorAll('h1.logo.floatLeft');
logo.onload = function() {removeLogo()};

function removeLogo(){
    console.log("### logo array lenght: " + logo.length);
    logo[1].remove();
};

Any tips? Thanks Giovanni

Answer 1

It is required:

• @ run-at: document-start in the userscript metablock.

  // ==UserScript==
  ..............
  // @run-at        document-start
  ..............
  // ==/UserScript==
  

Now with your options above:

• , :

  (document.head || document.documentElement).insertAdjacentHTML('beforeend',
      '<style>h1.logo.floatLeft { display: none!important; }</style>');
  

• MutationObserver DOM.

  • ( )?
  • HTML ( " " )
  • MutationObserver DOM.

   

  new MutationObserver(function(mutations) {
      // check at least two H1 exist using the extremely fast getElementsByTagName
      // which is faster than enumerating all the added nodes in mutations
      if (document.getElementsByTagName('h1')[1]) {
          var ibmlogo = document.querySelectorAll('h1.logo.floatLeft')[1];
          if (ibmlogo) {
              ibmlogo.remove();
              this.disconnect(); // disconnect the observer
          }
      }
  }).observe(document, {childList: true, subtree: true});
  // the above observes added/removed nodes on all descendants recursively