1

Here is my very simple code:

document.addEventListener("DOMContentLoaded", function() {
   console.log('Your document is ready!');
});

I paste it in the developer console of the browser. However, it does not log anything. Could anyone please help me find out why is it happening?

All I get after executing the script is undefined. The same code works if I remove the loading wrapper.

console.log('Your document is ready!');

I want to run the script in Tampermonkey. Here is the original script:

document.addEventListener("DOMContentLoaded", function(){
  document.querySelector("._3xiuDJ ._52MoHd").innerHTML = 'Test';
});

With the DOM load event, it does not do anything. Without the DOM load event, I get the following error:

document.querySelector(...) is null

If I directly paste it in the developer console like this,

document.querySelector("._3xiuDJ ._52MoHd").innerHTML = 'Test';

It works perfectly.

If I place it in the Tampermonkey script. It gives me the above null error. If I place it inside the wrapper in the Tampermonkey script, it does not do anything.

Thanks.

Daniel
  • 3,541
  • 3
  • 33
  • 46
Real Noob
  • 1,369
  • 2
  • 15
  • 29
  • 3
    The event fires _when_ the DOM has loaded. The DOM, presumably, has already loaded when you open the console and run the code so it won't fire the event (again). The `undefined` [is expected behaviour](https://stackoverflow.com/a/14634066/1377002). – Andy Aug 11 '19 at 11:40
  • Thanks @Andy. :) I run the same code using the Tapermonkey Addon (https://www.tampermonkey.net/) and it still does not work. – Real Noob Aug 11 '19 at 11:42
  • I need to access some DOM elements. So, if I run the code with DOM load event, I still get an error. – Real Noob Aug 11 '19 at 11:43
  • You should just be able to access the DOM without checking to see if its loaded (I've written a number of addons and have never had to perform that check). Perhaps if you update your question with the code you're using to try and access the DOM, and a sample of the HTML as a [mcve] we could check to see why that code doesn't work intead. – Andy Aug 11 '19 at 11:46
  • @Andy I have added the code with the changes. – Real Noob Aug 11 '19 at 11:47
  • 2
    In your script header have you got a @run-at command? If you have, remove it. The only other thing I can think of is that the portion of HTML you're trying to access is being dynamically loaded _after_ the DOM has loaded, and that's why you can't immediately grab it. – Andy Aug 11 '19 at 11:57
  • 2
    Thanks @Andy. You were right, the content was loading dynamically. I did some tests to verify this and finally ended up using a timer to check if the element has been loaded. – Real Noob Aug 11 '19 at 19:14

1 Answers1

0

In your script header have you got a @run-at command? If you have, remove it.

The only other thing I can think of is that the portion of HTML you're trying to access is being dynamically loaded after the DOM has loaded, and that's why you can't immediately grab it.

– Andy Aug 11 at 11:57

Nickolay
  • 31,095
  • 13
  • 107
  • 185