10

I have been searching the internet for days now trying to find out how to write my own script, one more complicated than the "Hello World" script.

I understand for the most part how to find specific elements using firebug (I have Firefox). I understand the metadata and how to do all that.

I do not however understand how I am supposed to get whatever I want into the page. Be it links or tabs for Facebook or other sites.

Can anyone help me get a full tutorial/guide that is up to date and easy to understand for total scriptwriting beginners?

Brock Adams
  • 90,639
  • 22
  • 233
  • 295
Landon
  • 109
  • 1
  • 3
  • 2
    Start here: http://wiki.greasespot.net/Tutorials – Wayne Jul 14 '11 at 22:34
  • 1
    Not a tutorial, but a fast way to get up and running is to find a script that does what you want (it probably exists) at [userscripts.org](http://userscripts.org), and then tweak it if necessary. Also much of what you want to do has *probably* been asked about here on SO, so search here too. – Brock Adams Jul 14 '11 at 22:46
  • http://stackoverflow.com/questions/4749582/recommendations-for-a-getting-started-with-greasemonkey-tutorial – Gaurav Jul 14 '11 at 23:18
  • @Gaurav, that question was more for Chrome-compatible scripts. Since the OP has stated that he's using Firefox, there's no reason to go through that extra hassle. – Brock Adams Jul 15 '11 at 00:05

2 Answers2

9

From what you have described in the, I suspect that anything that meets your criteria will actually just be a Javascript tutorial with some extra Greasemonkey-specific sections / focus

There's not links to many guides and tutorials (might add them in later) but I really think that what you need is a beginner's guide to Javascript such as sections 1-8 (except 5) of the one provided at the Mozilla Developer Network.

Greasemonkey stuff:

Specifically, the Greasemonkey-related topics that you will need to read up on are related to the DOM, altering styles of DOM nodes, and the Greasemonkey API. All else that you need will be generic Javascript that will be specific to the script you are creating.

  1. DOM Manipulation:

Inserting / editing / deleting "nodes" ( in the HTML code) - for example, <a>nchors, <div>s, <img>s

This is how the extra links and tabs etc are added into the page.

Specifically, look into appendChild(), createNode() and insertNodeBefore().

  1. DOM Traversal

Moving around the DOM (HMTL Document) and selecting where to insert the new nodes / selecting which nodes to editor delete.

Specifically, look into XPATH, getElement(s)By_____, parentNode, querySelectorAll()

  1. CSS Using Javascript

The basics of changing the CSS of a node are to either use .setAttribute() to set the 'style' attribute, or to alter specific CSS properties using nodeReference.style.cssAttribute = 'value'.

  1. Greasemonkey API

Again, this stuff will be specific to what you want to use within the script you create but the basics include GM_getValue(), GM_setValue(), GM_log()

Erman Kadir Kahraman
  • 469
  • 6
  • 6
kwah
  • 1,149
  • 1
  • 13
  • 27
2

Look at Greasemonkey Hacks archived, especially the part Avoid Common Pitfalls archived - I'm often returning to the latter.

Edit: the original links are dead, added links to recent archived version in superscript.

Wolf
  • 9,679
  • 7
  • 62
  • 108
jakub.g
  • 38,512
  • 12
  • 92
  • 130
  • If someone having an account in the GreaseSpot wiki, it would be nice to update the link(s) there https://wiki.greasespot.net/Tutorials accordingly – Wolf Feb 28 '20 at 15:44