A ideia por trás do Greasemonkey é bem simples. É uma extensão do Firefox, instalada da mesma forma que qualquer outra extensão do Firefox (encontre-a no menu Ferramentas> Addons e clique em Instalar).

No entanto, ele não faz nada em si mesmo: o que ele faz é permitir que você execute scripts, seja por outras pessoas ou por você mesmo, o que alterará a aparência e a função das páginas da Web..

Os scripts de usuário do Greasemonkey são os bits de código que realmente fazem o trabalho - o próprio Greasemonkey apenas os carrega e gerencia. Os scripts de usuário são escritos em JavaScript, mas estejam avisados: por questões de segurança, isso não é apenas uma questão de escrever JavaScript comum e você vai embora.

Há algumas dicas, embora os scripts deste guia não encontrem nenhum deles. Uma observação rápida, se você não estiver familiarizado com o JavaScript: este guia não vai explicar a sintaxe do JavaScript em nenhum detalhe, mas não deixe que isso o impeça de experimentar. É tudo bastante lógico e os trechos de código são todos explicados.

Para instalar um script escrito por outra pessoa, navegue até seu local no Firefox e clique no link para o script. Você obterá um pop-up de instalação, como em uma extensão normal, e poderá ver primeiro o código-fonte do script ou, se estiver se sentindo confiante, basta instalá-lo.

Parte 1 - Seu primeiro script do Greasemonkey

O Greasemonkey fornece um diálogo útil para tornar a escrita de um script o mais simples possível. Na sua janela do Firefox, uma vez que você tenha baixado e instalado o Greasemonkey, haverá uma pequena cara de macaco no canto direito da barra de status..

Clique com o botão direito do mouse e você receberá um menu que inclui a opção "Novo Script de Usuário". Clique nele e você verá um diálogo parecendo a caixa à direita.

O 'nome' é apenas o nome do seu script - é melhor escolher algo que obviamente indica o que ele faz, para facilitar o gerenciamento de scripts mais tarde. O 'namespace' é evitar que o seu script entre em conflito com os outros.

Se você tentar instalar um script que tenha o mesmo nome de um já instalado, é o espaço de nomes que governa se ele substituirá o antigo (se o espaço de nomes for o mesmo) ou coexistir com ele (se forem diferente).

Há algumas coisas que você pode fazer aqui: a primeira é usar seu próprio site como nome de domínio. Alternativamente, você pode usar http: // localhost, ou se você pretende enviá-lo para http://userscripts.org quando estiver pronto, você pode usar isso.

As versões atuais do Greasemonkey não permitem que você deixe em branco. 'Descrição' é para uma linha legível que descreve o que o script faz. É uma boa ideia preencher este campo, mesmo para os seus próprios scripts - você pode acabar com as pilhas das coisas e eles serão muito mais fáceis de gerenciar se você fornecer pistas extras sobre qual é qual.

Hackear a web

As regras 'include' e 'exclude' determinam em quais sites um script será executado e podem incluir curingas. assim, www.example. com / * corresponderá www.example.com/ e todas as páginas que começam com essa URL (enquanto www.example.com/ sem o asterisco apenas incluirá a primeira página).

Você também pode usar curingas para partes de nomes: http: //*.example.com/f* corresponderá a qualquer página cujo caminho comece com f, em qualquer servidor no domínio example.com. Por padrão, a caixa de inclusão conterá a página em que você estava quando você clicou na nova opção de script, mas você pode excluí-la.

Se uma regra de inclusão for correspondida e nenhuma regra de exclusão for correspondida, o script será executado. Se você não tem nenhuma regra de inclusão, o Greasemonkey assume @incluir *, ou seja, que cada URL é correspondido, então o script será executado em todas as páginas que você carregar.

Este primeiro script vai definir o fundo de uma página para branco - muito útil, de fato, se você se deparar com uma página cujo autor tem uma predileção por cor-de-rosa, ou o tipo de imagem de fundo que gera uma dor de cabeça em segundos.

Então, escolha um site que você deseja alterar o plano de fundo e colocá-lo no caixa @include (aqui estou usando www.example.com) e defina os outros campos conforme apropriado.

Uma vez preenchido, você será perguntado pelo seu editor preferido (se já não houver um conjunto), e então o Greasemonkey carregará o arquivo de script - que atualmente conterá apenas os metadados - no seu editor, pronto para você escrever algo.

Neste ponto, o código que você está enfrentando vai parecer um pouco assim:

// == UserScript ==
// @name Background Change
// @namespace http://www.example.com/ juliet /
// @description Altere a cor de fundo de uma página
// @include http://www.example.com/*
// == / UserScript ==

Agora é hora de realmente escrever o roteiro. Tudo o que este primeiro script faz é alterar a cor de fundo de qualquer página de sites no incluir domínio para branco. (Existem algumas opções de cores de fundo desagradáveis ​​por aí.)

Para uma página sem frames ou outras complicações, isso é muito simples: apenas uma linha.

document.body.style.background = "#ffffff";

documento é a maneira interna de se referir à página atual. É um objeto DOM (Document Object Model) que representa todo o documento HTML.

Pense nisso como uma árvore de elementos HTML vistos como objetos, com cada novo elemento se ramificando como um 'filho' daquele antes - dê uma olhada no diagrama abaixo, que mostra uma possível estrutura para a parte do corpo de um HTML documento.

ÁRVORE DOMÉSTICA: Um documento HTML como uma árvore DOM - cada nó filho se ramifica a partir de seu nó pai

A notação para referir-se a um objeto neste modelo é toplevel.child.childofchild. Portanto, essa linha pega o documento, depois o elemento body, depois o estilo do corpo, depois o atributo background do estilo ... e o define como branco. (#ffffff é branco em notação hexadecimal, que é um dos padrões HTML. Você também pode usar apenas branco.)

Experimente agora - escolha uma página com um plano de fundo que não seja branco, use o menu Gerenciar Scripts para adicioná-la aos includes do seu script e recarregue a página.

Ao testar, lembre-se: você não está realmente fazendo nada na página da Web que está editando. Você está apenas mudando isso para você. Então, se você fizer algo catastrófico, não há problema! Você pode simplesmente desativar seu script ou editá-lo e recarregar a página. Então, fique à vontade para experimentar.

Quando você está testando, se você clicar com o botão esquerdo no rosto do macaquinho, ele ativará / desativará o Greasemonkey. Assim, você pode desativá-lo, verificar como a página está atualmente, ativá-la, recarregar e ver o que seu script está fazendo.