Search code examples
javascripthtmlgoogle-chrome-extensiontampermonkey

Running user scripts without Tamper Monkey

I have been experimenting with Tampermonkey and making scripts to change web elements. I ran the following user script in Tamper Monkey :

// ==UserScript==
// @name       "job changer"
// @namespace  Marshmellows
// @version    0.1
// @description  Change 'Jobs' in stackoverflow to Hello!
// @match      http://stackoverflow.com/*
// @copyright  
// @require http://code.jquery.com/jquery-latest.js
// ==/UserScript==

$(document).ready(function() {
    document.getElementById('nav-jobs').innerHTML = 'Hello!';
});

This js did what it was supposed by using Tamper Monkey. The js file that I am using for this particular extension. However, if I manually install this js as an extension for chrome, the script no longer works. The extension was installed but does not work. Can somebody please offer than guidance for this problem.

Thanks

Solution

  • You can either avoid using @require as it's not supported natively and write in vanilla JavaScript:

    // ==UserScript==
// @name       "job changer"
// @namespace  Marshmellows
// @version    0.1
// @description  Change 'Jobs' in stackoverflow to Hello!
// @match      https://stackoverflow.com/*
// @grant      none
// @run-at     document-start
// ==/UserScript==

document.addEventListener('DOMContentLoaded', function() {
    document.getElementById('nav-jobs').innerHTML = 'Hello!';
}, false);

    Or add jQuery directly inside the code:
    How can I use jQuery in Greasemonkey scripts in Google Chrome?