Javascript é uma linguagem de programação utilizada para criar pequenas interações dentro do âmbito de uma página web.
INICIANDO...
javascript:alert("Seja bem vindo a nossa comunidade!");void(0);
Observe o código acima. Quando inserido na barra de endereços, ele faz um menu suspenso aparecer na tela com a mensagem. O que podemos aprender com ele? Algumas coisas:
1º - Para começar, deve-se aprender que todo javascript que é inserido como código na barra de endereços deve começar com o termo "javascript" (em verde), para que o navegador não interprete o conteúdo como um link, ou como uma pesquisa para o site de pesquisas.
Exemplo: Se o código acima for inserido sem o "javascript", o navegador interpretará o código como um link, ou como uma pesquisa, para o site: http://www.alert("Seja bem vindo a nossa comunidade");void(0); - site este, inexistente.
2º - A maioria dos códigos criados dever terminar com a instrução "void(0);". Ela permite que o código tenha seu resultado dentro da página em que foi usado. Mas sua função original é fazer com que o código retorne valor nenhum.
Exemplo:
javascript:msg=document.getElementsByTagName('textarea')[0];msg.value=2*5;void(0);
Teste o js acima na página para enviar mensagens
Observe que o código acima calcula o valor de 2 vezes 5, e coloca o resultado (10) na caixa de mensagens. Se você tirar o "void(0);" do final do código, o resultado aparecerá numa outra página, fora do Orkut. Ou seja, a instrução "void(0);" mantêm o valor no próprio lugar onde ele foi calculado (na página de postar mensagens do Orkut).
3º - Sempre após alguma instrução escrita em um código, deve-se usar o simbolo ";" (ponto e vírgula). Ele serve para separar as instruções e fazer elas ficarem ordenadas.
VARIÁVEIS
O que são variáveis?
RS: Variáveis são nomes, ou palavras inventadas por quem cria um código, com a função de guardar valores dentro delas.
Para que servem as variáveis?
RS: Basicamente as variáveis servem para duas coisas:
1ª - Muitas pessoas têm apelidos. Não importa qual seja, bonito ou feio, ofensivo ou simpático, você gostando ou não, este apelido substitui o seu nome em diversas ocasiões. As variáveis têm significado (função) parecido: elas servem para você "dar um novo nome" à alguma coisa no código.
Exemplo: dez = 2*5;
No exemplo acima, a variável "dez" é igual ao resultado da multiplicação entre 2*5... ou seja, demos ao valor 10 (2 vezes 5) um novo nome ("dez").
Ainda no exemplo, todas as vezes que naquele código nos referirmos à palavra "dez" estaremos lembrando do número 10 (por que atribuímos à palavra "dez" o número 10).
2ª - As variáveis tem a função de "guardar" qualquer valor, frase ou propriedade em um código.
Exemplo:
javascript:txt = "Você é muito inteligente!";alert(txt);void(0);
Neste exemplo acima, toda a frase em azul foi transformada, ou guardada, em uma única variável em vermelho (txt) e depois, foi solicitada no comando alert();
Observe que a frase aparece no menu, por que a variável "guardou" a frase dentro dela.
O exemplo acima também poderia ser escrito dessa maneira:
javascript: alert("Você é muito inteligente!");void(0);
Agora eu darei um exemplo de como as variáveis podem ajudar a deixar um código mais fácil de ser criado (se corretamente usadas...):
Exemplo:
javascript: ler = "Desligue o computador e vá ler um livro.";alert(ler+ler+ler+ler+ler);void(0);
Observe que a variável "ler" (em vermelho) guardou a frase "Desligue o computador e vá ler um livro." (em azul). Depois, o javascript chamou a função alert(); e inseriu 5 vezes a variável "ler". Ou seja, a frase "Desligue o comp..." vai aparecer 5 vezes. Se não tivéssemos usado a variável "ler", olhem só como ficaria o código:
javascript:alert("Desligue o computador e vá ler um livro."+"Desligue o computador e vá ler um livro."+"Desligue o computador e vá ler um livro."+"Desligue o computador e vá ler um livro."+"Desligue o computador e vá ler um livro.");void(0);
Entenderam a importância do uso de variáveis?
COMO DECLARAR VARIÁVEIS
Bom, como eu já tinha dito, uma variável "guarda" valores, frases, ou propriedades no código. Ela torna a escrita do código muito mais fácil, além de auxiliar em algumas coisas mais avançadas (não convém explicá-las agora). Agora é preciso saber como declarar uma variável.
Mas antes, é preciso explicar para que serve o sinal de igual ("=")...
O sinal de igual (o que a gente usa na matemática), ele não tem a mesma função que ele tem na matemática, aqui. Ele serve para você declarar variáveis, ou atribuir valores à alguma coisa. Se você quiser usar um sinal para expressar uma igualdade,NUNCA use o sinal de igual em sí. Você deve usar um sinal de igual duplo, assim: == .
Tá, agora que você sabe que o igual ("=") serve para declarar variáveis, vamos entender como declarar uma:
1º - A primeira coisa que se precisa saber, é que quando você for declarar uma variável, ela deve vir à esquerda do sinal de igual. Depois você põe o sinal, e à direita dele, você coloca o que se quer declarar;
2º - Para se declarar uma frase, deve-se colocá-la entre aspas (");
3º - Há algumas palavras que nunca podem ser usadas como variáveis.
Exemplos:
if
for
document
while
do
function
case
switch
break
return
void
e muitas outras...
Exemplo:
rua = "Avenida Brasil, número 790."
No exemplo acima, a variável em vermelho ("rua") foi colocada à esquerda do sinal de atribuição de valores em verde ("="). E a frase em azul foi colocada à direita do sinal, entre aspas.
Ou seja, a declaração de variáveis sempre seguirá esse padrão:
variável = frase ou propriedade
OBS: Uma variável nunca pode vir entre aspas!!!!!!!
OBSERVAÇÃO MUITO IMPORTANTE!!!: Alguns usuários não estão conseguindo declarar frases, devido ao fato de estarem usando aspas duplas (") ao invés de aspas simples (').
Se o seu código não estiver funcionando, tente usar as aspas simples para ver se ele funciona.
EXEMPLO COM ASPAS SIMPLES:
javascript: alert('Funcionou? Então use aspas simples!');void(0);
EXEMPLO COM ASPAS DUPLAS:
javascript: alert("Funcionou? Então use aspas duplas!");void(0);
Se os dois métodos funcionarem, USE ASPAS DUPLAS. Se só as aspas simples funcionarem, USE ASPAS SIMPLES.
ÚLTIMA DICA: Se ainda sim não funcionar, troque de navegador. Use Internet Explorer se estiver no FireFox e vice-versa.
1ªPARTE ENCERRADA...
Antes de começar essa parte, recomendo que você leia e entenda a primeira. Isso é muito importante para que você não se perca durante a continuidade das coisas...
Começarei agora a mostrar coisas mais "difíceis", por isso, é importante que você não siga à frente com dúvidas sobre as variáveis.
============================================================
COMEÇANDO... - ALGUNS COMANDOS E OBJETOS...
Muitos já sabem a função do comando "alert()", mas é bom explicar para quem ainda não sabe:
O comando "alert()" abre um menu com apenas um botão, e nele, é possível inserir qualquer texto, variável ou propriedade. Lembre-se: todo texto inserido dentro do comando "alert()", deve ser inserido entre aspas. Ai você pergunta, mas porquê??
Como quando você declara variáveis, toda frase no código deve vir entre aspas. Ou seja, tudo que você deseja que seje uma frase e que apareça de alguma forma no resultado do código, deve vir entre aspas. Sem elas, o texto ou palavra vira uma variável.
Exemplo Correto:
legal = "Meu cachorro é legal."
legal - é a variável (sem aspas)
"Meu cachorro é legal." - é a frase (entre aspas)
=============================================
Exemplo Errado:
"legal" = "Meu cachorro é legal."
"legal" - frase
"Meu cachorro é legal." - frase
O primeiro exemplo está certo ,porque a variável está sem aspas e a frase está com aspas. A variável está à esquerda e a frase, à direita.
O segundo exemplo está errado, porque a variável está com aspas. Isso faz a variável virar uma frase, o que é logicamente errado (não se pode dar a uma frase, outra frase... entendeu ¿).
Voltando ao comando "alert()"...
Agora, um segredo que poucas pessoas contam, mas estou aqui justamente para revelar tudo.
Que o comando "alert()" é o primeiro a ser aprendido, é o mais fácil e simples, todo mundo sabe. O que pouca gente sabe, é que ele é um dos jeitos mais fáceis de se encontrar bugs e propriedades usadas para se criar códigos importantes. Você quer um exemplo?
javascript:a=document.cookie;alert(a);void(0);
Execute o java acima, e veja os seus cookies! FIQUE TRANQUILO: os seus cookies, só você verá, e eles não serão vistos por mais ninguém. Perceba que o comando "alert()" foi usado para testar se você tem ou não cookies. Foi assim que algumas pessoas ligaram as informações e inventaram o código para roubá-los.
Se você se sentir inseguro de usar o java acima (ainda não confia na minha pessoa), teste o java abaixo:
javascript:a=document.URL;alert(a);void(0)
O java acima indica a você por meio do comando "alert()", qual é o link da página em que você usou este código.
Bom, como você deve ter percebido, o comando "alert()" não serve apenas para você escrever seu nome e um "olá" pra quem usa; ele é uma das bases para testes em códigos.
INICIANDO...
javascript:alert("Seja bem vindo a nossa comunidade!");void(0);
Observe o código acima. Quando inserido na barra de endereços, ele faz um menu suspenso aparecer na tela com a mensagem. O que podemos aprender com ele? Algumas coisas:
1º - Para começar, deve-se aprender que todo javascript que é inserido como código na barra de endereços deve começar com o termo "javascript" (em verde), para que o navegador não interprete o conteúdo como um link, ou como uma pesquisa para o site de pesquisas.
Exemplo: Se o código acima for inserido sem o "javascript", o navegador interpretará o código como um link, ou como uma pesquisa, para o site: http://www.alert("Seja bem vindo a nossa comunidade");void(0); - site este, inexistente.
2º - A maioria dos códigos criados dever terminar com a instrução "void(0);". Ela permite que o código tenha seu resultado dentro da página em que foi usado. Mas sua função original é fazer com que o código retorne valor nenhum.
Exemplo:
javascript:msg=document.getElementsByTag
Teste o js acima na página para enviar mensagens
Observe que o código acima calcula o valor de 2 vezes 5, e coloca o resultado (10) na caixa de mensagens. Se você tirar o "void(0);" do final do código, o resultado aparecerá numa outra página, fora do Orkut. Ou seja, a instrução "void(0);" mantêm o valor no próprio lugar onde ele foi calculado (na página de postar mensagens do Orkut).
3º - Sempre após alguma instrução escrita em um código, deve-se usar o simbolo ";" (ponto e vírgula). Ele serve para separar as instruções e fazer elas ficarem ordenadas.
VARIÁVEIS
O que são variáveis?
RS: Variáveis são nomes, ou palavras inventadas por quem cria um código, com a função de guardar valores dentro delas.
Para que servem as variáveis?
RS: Basicamente as variáveis servem para duas coisas:
1ª - Muitas pessoas têm apelidos. Não importa qual seja, bonito ou feio, ofensivo ou simpático, você gostando ou não, este apelido substitui o seu nome em diversas ocasiões. As variáveis têm significado (função) parecido: elas servem para você "dar um novo nome" à alguma coisa no código.
Exemplo: dez = 2*5;
No exemplo acima, a variável "dez" é igual ao resultado da multiplicação entre 2*5... ou seja, demos ao valor 10 (2 vezes 5) um novo nome ("dez").
Ainda no exemplo, todas as vezes que naquele código nos referirmos à palavra "dez" estaremos lembrando do número 10 (por que atribuímos à palavra "dez" o número 10).
2ª - As variáveis tem a função de "guardar" qualquer valor, frase ou propriedade em um código.
Exemplo:
javascript:txt = "Você é muito inteligente!";alert(txt);void(0);
Neste exemplo acima, toda a frase em azul foi transformada, ou guardada, em uma única variável em vermelho (txt) e depois, foi solicitada no comando alert();
Observe que a frase aparece no menu, por que a variável "guardou" a frase dentro dela.
O exemplo acima também poderia ser escrito dessa maneira:
javascript: alert("Você é muito inteligente!");void(0);
Agora eu darei um exemplo de como as variáveis podem ajudar a deixar um código mais fácil de ser criado (se corretamente usadas...):
Exemplo:
javascript: ler = "Desligue o computador e vá ler um livro.";alert(ler+ler+ler+ler+ler);void(
Observe que a variável "ler" (em vermelho) guardou a frase "Desligue o computador e vá ler um livro." (em azul). Depois, o javascript chamou a função alert(); e inseriu 5 vezes a variável "ler". Ou seja, a frase "Desligue o comp..." vai aparecer 5 vezes. Se não tivéssemos usado a variável "ler", olhem só como ficaria o código:
javascript:alert("Desligue o computador e vá ler um livro."+"Desligue o computador e vá ler um livro."+"Desligue o computador e vá ler um livro."+"Desligue o computador e vá ler um livro."+"Desligue o computador e vá ler um livro.");void(0);
Entenderam a importância do uso de variáveis?
COMO DECLARAR VARIÁVEIS
Bom, como eu já tinha dito, uma variável "guarda" valores, frases, ou propriedades no código. Ela torna a escrita do código muito mais fácil, além de auxiliar em algumas coisas mais avançadas (não convém explicá-las agora). Agora é preciso saber como declarar uma variável.
Mas antes, é preciso explicar para que serve o sinal de igual ("=")...
O sinal de igual (o que a gente usa na matemática), ele não tem a mesma função que ele tem na matemática, aqui. Ele serve para você declarar variáveis, ou atribuir valores à alguma coisa. Se você quiser usar um sinal para expressar uma igualdade,NUNCA use o sinal de igual em sí. Você deve usar um sinal de igual duplo, assim: == .
Tá, agora que você sabe que o igual ("=") serve para declarar variáveis, vamos entender como declarar uma:
1º - A primeira coisa que se precisa saber, é que quando você for declarar uma variável, ela deve vir à esquerda do sinal de igual. Depois você põe o sinal, e à direita dele, você coloca o que se quer declarar;
2º - Para se declarar uma frase, deve-se colocá-la entre aspas (");
3º - Há algumas palavras que nunca podem ser usadas como variáveis.
Exemplos:
if
for
document
while
do
function
case
switch
break
return
void
e muitas outras...
Exemplo:
rua = "Avenida Brasil, número 790."
No exemplo acima, a variável em vermelho ("rua") foi colocada à esquerda do sinal de atribuição de valores em verde ("="). E a frase em azul foi colocada à direita do sinal, entre aspas.
Ou seja, a declaração de variáveis sempre seguirá esse padrão:
variável = frase ou propriedade
OBS: Uma variável nunca pode vir entre aspas!!!!!!!
OBSERVAÇÃO MUITO IMPORTANTE!!!: Alguns usuários não estão conseguindo declarar frases, devido ao fato de estarem usando aspas duplas (") ao invés de aspas simples (').
Se o seu código não estiver funcionando, tente usar as aspas simples para ver se ele funciona.
EXEMPLO COM ASPAS SIMPLES:
javascript: alert('Funcionou? Então use aspas simples!');void(0);
EXEMPLO COM ASPAS DUPLAS:
javascript: alert("Funcionou? Então use aspas duplas!");void(0);
Se os dois métodos funcionarem, USE ASPAS DUPLAS. Se só as aspas simples funcionarem, USE ASPAS SIMPLES.
ÚLTIMA DICA: Se ainda sim não funcionar, troque de navegador. Use Internet Explorer se estiver no FireFox e vice-versa.
1ªPARTE ENCERRADA...
Antes de começar essa parte, recomendo que você leia e entenda a primeira. Isso é muito importante para que você não se perca durante a continuidade das coisas...
Começarei agora a mostrar coisas mais "difíceis", por isso, é importante que você não siga à frente com dúvidas sobre as variáveis.
========================================
COMEÇANDO... - ALGUNS COMANDOS E OBJETOS...
Muitos já sabem a função do comando "alert()", mas é bom explicar para quem ainda não sabe:
O comando "alert()" abre um menu com apenas um botão, e nele, é possível inserir qualquer texto, variável ou propriedade. Lembre-se: todo texto inserido dentro do comando "alert()", deve ser inserido entre aspas. Ai você pergunta, mas porquê??
Como quando você declara variáveis, toda frase no código deve vir entre aspas. Ou seja, tudo que você deseja que seje uma frase e que apareça de alguma forma no resultado do código, deve vir entre aspas. Sem elas, o texto ou palavra vira uma variável.
Exemplo Correto:
legal = "Meu cachorro é legal."
legal - é a variável (sem aspas)
"Meu cachorro é legal." - é a frase (entre aspas)
========================================
Exemplo Errado:
"legal" = "Meu cachorro é legal."
"legal" - frase
"Meu cachorro é legal." - frase
O primeiro exemplo está certo ,porque a variável está sem aspas e a frase está com aspas. A variável está à esquerda e a frase, à direita.
O segundo exemplo está errado, porque a variável está com aspas. Isso faz a variável virar uma frase, o que é logicamente errado (não se pode dar a uma frase, outra frase... entendeu ¿).
Voltando ao comando "alert()"...
Agora, um segredo que poucas pessoas contam, mas estou aqui justamente para revelar tudo.
Que o comando "alert()" é o primeiro a ser aprendido, é o mais fácil e simples, todo mundo sabe. O que pouca gente sabe, é que ele é um dos jeitos mais fáceis de se encontrar bugs e propriedades usadas para se criar códigos importantes. Você quer um exemplo?
javascript:a=document.cookie;alert(a);vo
Execute o java acima, e veja os seus cookies! FIQUE TRANQUILO: os seus cookies, só você verá, e eles não serão vistos por mais ninguém. Perceba que o comando "alert()" foi usado para testar se você tem ou não cookies. Foi assim que algumas pessoas ligaram as informações e inventaram o código para roubá-los.
Se você se sentir inseguro de usar o java acima (ainda não confia na minha pessoa), teste o java abaixo:
javascript:a=document.URL;alert(a);void(
O java acima indica a você por meio do comando "alert()", qual é o link da página em que você usou este código.
Bom, como você deve ter percebido, o comando "alert()" não serve apenas para você escrever seu nome e um "olá" pra quem usa; ele é uma das bases para testes em códigos.
COMO SE REFERIR AS CAIXAS DE MENSAGENS DO ORKUT
As caixas de mensagens do Orkut podem ser manipuladas pelo comando:
document.getElementsByTagName(...)[0];
O objeto document é usado para se manipular todos os componetes da página os quais devem ser aprendidos mais tarde... mas para darmos continuidade ao nosso aprendizado, deve-se aprender a manipular essas caixas de texto. Vamos entender o que significa cada parte do comando:
document.getElementsByTagName(...)[0];
document = objeto que manipula tudo em uma página;
getElementsByTagName = tradução para o português:(pegar os elementos [ou objetos] pelo apelido);
(...)[0] = o nome do elemento (objeto) o qual você deseja se referir...
Ou seja, o comando irá procurar pela página (document) um objeto ((...)[0] --> com o nome da coisa que você quiser) pelo nome de apelido dele (.getElementsByTagName).
Percebe-se que pelo raciocínio, no (...)[0] você deve digitar o nome do apelido do que você quer. Como nós agora queremos as caixas de texto do Orkut, devemos colocar o nome-apelido delas dentro dos parênteses. Aí você me pergunta: qual é o nome-apelido das caixas de texto? A resposta é simples: textarea.
Um nome lógico, pois a tradução de textarea é "área de texto"; justamente o local onde se digita o texto para se postar.
Bom, então para se referir as caixas de texto, deve-se fazer:
document.getElementsByTagName('textarea')[0];
Notas: ...('textarea')[0]; ~~> o 'textarea' deve vir entre aspas simples (') e não aspas duplas ("). Porquê? Por que as aspas duplas servem para você fazer frases ou palavras inventadas por você. O nome textarea não foi inventado por você, ele é o nome de um objeto na página. Por isso deve vir entre aspas simples.
~~> Entenda como objeto, qualquer coisa na página. Desde as caixas onde você digita o texto, até botões, links, etc...
Exemplos: * O botão "responder" que há em todos os tópicos no Orkut é um objeto...
* A caixa onde você digita o seu post é um objeto...
* Até as fotos, do seu perfil, ou das comunidades são objetos.
A propriedade ".value"...
==================
Para mudar o valor de qualquer área de texto do Orkut, deve-se usar a propriedade ".value".
Com ela, além de você poder mudar o valor de alguma área de texto, você também poderá verificar valores.
Exemplo:
javascript: a = document.getElementsByTagName('textarea')[0].value;alert(a);void(0);
Antes de usar este código, digite qualquer coisa na caixa de mensagens (onde você digita o seu post)... e depois use o javascript... o que você digitou aparecerá no "alert()"...
O que isto significa? Significa que o javascript "pegou" o valor da área de texto ("document.getElementsByTagName('textarea')[0].value) e jogou no menu "alert()", usando a variável "a". Ou seja, com a propriedade ".value" pode-se obter o valor da área de texto, podendo jogá-la no "alert()".
Agora que aprendemos uma coisa importante, a propriedade ".value", podemos montar alguns javascripts, com base nessa propriedade.
As caixas de mensagens do Orkut podem ser manipuladas pelo comando:
document.getElementsByTagName(...)[0];
O objeto document é usado para se manipular todos os componetes da página os quais devem ser aprendidos mais tarde... mas para darmos continuidade ao nosso aprendizado, deve-se aprender a manipular essas caixas de texto. Vamos entender o que significa cada parte do comando:
document.getElementsByTagName(...)[0];
document = objeto que manipula tudo em uma página;
getElementsByTagName = tradução para o português:(pegar os elementos [ou objetos] pelo apelido);
(...)[0] = o nome do elemento (objeto) o qual você deseja se referir...
Ou seja, o comando irá procurar pela página (document) um objeto ((...)[0] --> com o nome da coisa que você quiser) pelo nome de apelido dele (.getElementsByTagName).
Percebe-se que pelo raciocínio, no (...)[0] você deve digitar o nome do apelido do que você quer. Como nós agora queremos as caixas de texto do Orkut, devemos colocar o nome-apelido delas dentro dos parênteses. Aí você me pergunta: qual é o nome-apelido das caixas de texto? A resposta é simples: textarea.
Um nome lógico, pois a tradução de textarea é "área de texto"; justamente o local onde se digita o texto para se postar.
Bom, então para se referir as caixas de texto, deve-se fazer:
document.getElementsByTagName('textarea'
~~> Entenda como objeto, qualquer coisa na página. Desde as caixas onde você digita o texto, até botões, links, etc...
Exemplos: * O botão "responder" que há em todos os tópicos no Orkut é um objeto...
* A caixa onde você digita o seu post é um objeto...
* Até as fotos, do seu perfil, ou das comunidades são objetos.
A propriedade ".value"...
==================
Para mudar o valor de qualquer área de texto do Orkut, deve-se usar a propriedade ".value".
Com ela, além de você poder mudar o valor de alguma área de texto, você também poderá verificar valores.
Exemplo:
javascript: a = document.getElementsByTagName('textarea'
Antes de usar este código, digite qualquer coisa na caixa de mensagens (onde você digita o seu post)... e depois use o javascript... o que você digitou aparecerá no "alert()"...
O que isto significa? Significa que o javascript "pegou" o valor da área de texto ("document.getElementsByTagName('textare
Agora que aprendemos uma coisa importante, a propriedade ".value", podemos montar alguns javascripts, com base nessa propriedade.
PROBLEMA 1: Criar um js que insira automaticamente um nome no final da mensagem... Assim:
by: King Of The System
Viram essa parte do post?
============================================================
A gente costuma chamar isso aí de "assinatura"... pois vêm sempre no final do post, e geralmente com o seu nome, e uma frase ou texto qualquer...
Eu não digitei isso, ele apareceu sozinho; apenas usei um javascript!
A questão é:
Como programar um javascript, para sempre inserir a sua assinatura no final do post?
Sabendo que depois que você digita a mensagem, você teria de usar o código para ele inserir o seu nome, então:
a = document.getElementsByTagName('textarea')[0];
a.value;~~> Isso irá pegar todo o texto que você digitou... Porquê?
Por que esta parte irá pegar o valor da caixa de texto onde você digita o post (sendo "a" a caixa de texto e "a.value", o seu valor)...
Você quer que a assinatura apareça no código. Você pode dar a ela, uma variável:
ass = "_________________ By King Of The System";
ass ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~> variável
"_________________ By King Of The System" ~~> frase
============================================================
Imagine agora: Você quer "somar" o texto que você digitou, com a assinatura (no caso a minha, você pode fazer a sua) no final do texto; ou seja, o texto digitado, mais a assinatura deverão ser um texto só...
Então, se "a.value" é o valor da caixa de texto (aquilo que você digitou) e "ass" é a sua assinatura, somar os dois seria assim:
a.value + ass;
Aí você fala, pô mais isso é difícil demais! Não é não, apenas preste bastante atenção:
a.value ~~> valor da caixa de texto
ass ~~~~> assinatura
Ou seja, a soma do texto que você digitou ("a.value") com a sua assinatura ("ass").
Tá, somamos os dois textos. E para fazer ele aparecer no post?
Se o valor da caixa de texto é "a.value", e você quer que esse valor seja igual ao texto somado ali em cima...
Explicando por partes:
a.value = a.value + ass;
#¨¨¨¨#¨¨¨#¨¨#¨¨###> a assinatura
#¨¨¨¨#¨¨¨#¨¨#
#¨¨¨¨#¨¨¨#¨¨###> mais...
#¨¨¨¨#¨¨¨#
#¨¨¨¨#¨¨¨###> ao valor atual da própria caixa de texto...
#¨¨¨¨#
#¨¨¨¨###> é igual...
#
########> o valor da caixa de texto...
============================================================
Agora é só finalizar o código com o "void(0);"...
Código finalizado:
javascript: a = document.getElementsByTagName('textarea')[0]; ass = "_________________ By King Of The System"; a.value = a.value + ass; void(0);
Quando você usar este código na página de postar, você vai perceber que ele não pulou linhas... ficou meio "desorganizado"... Porquê?
Por que não pensamos em pular a linha. Para pular linhas, você deve usar o caractere \n .
Ele pulará a linha, e o que estiver escrito depois dele irá para a linha debaixo.
Então...
ass = "\n\n_________________ \nBy King\nOf\nThe\nSystem";
Perceba que logo no início, eu usei o caractere \n duas vezes (\n\n). Isto fará com que a assinatura seja colocada duas linhas abaixo do texto que você digitou...
Agora eu vou refazer o javascript, com a nova assinatura, pulando linhas:
javascript: a = document.getElementsByTagName('textarea')[0];ass = "\n\n_________________ \nBy King\nOf\nThe\nSystem";a.value = a.value + ass; void(0);
PRONTO!
Use o javascript na página de postar as mensagens, depois de ter escrito alguma coisa... ele aparecerá lá automaticamente!
O MÉTODO "replace()"
Se você já entendeu a propriedade "value", que retorna ou atribui valor à alguma coisa, será interessante que aprenda-mos o método "replace()".
Para que serve o método "replace()" ?
A tradução de "replace()" é: substituir. Ou seja, o método "replace()" serve para substituir algum caractere por outro. Todas as ocorrências do caractere no texto atribuído serão substituídas pela sua escolha no "replace()" . Por exemplo, se você quiser trocar todas as letras "a" de um texto para a letra "e", o método "replace()" é o usado para essa tarefa.
Como usar o método "replace()" (síntaxe):
A primeira coisa a dizer, é que o método deve ser usado depois de uma variável ou propriedade.
Exemplos:
a.replace(...);
pi.replace(...);
b.value.replace(...);
c.value.replace(...);
As variáveis estão em vermelho, a propriedade "value" em verde e o método "replace(...)" em azul.
MUITO IMPORTANTE!!!: Observe que entre as variáveis e as propriedades existe um . (ponto):
c . value . replace(...);
O ponto serve para "concatenar" ou "juntar" as coisas no código. Juntar variáveis com propriedades ou métodos... para que não fique desorganizado.
Como o método "replace()" substitui os caracteres?
Vamos pegar um exemplo bem simples, o de trocar todas as letras "a" de uma coisa que você digitar na caixa de texto:
javascript:x=document.getElementsByTagName('textarea')[0];x.value=x.value.replace(/a/g,"u");alert(x);void(0);
Este js deve ser testado na página de postar...
Como faríamos para trocar as letras "a" do que foi digitado é fácil. A variável "x" guardou a frase dentro dela. Logo, o valor da variável "x" é "x.value" . Se nós queremos substituir todas as letras "a" da frase, seria a mesma coisa dizer que queremos substituir as letras "a" do valor da variável "x" . Assim:
x.value.replace(...);
x ~~> variável "x"
x.value ~~> O valor da variável "x" (aquela frase...)
x.value.replace(...) ~~> substituir o valor da variável "x"
Tá, chegamos à parte principal. Agora, como fazer para que o método "replace()" substitua apenas as letras "a" por uma outra letra qualquer?
.replace();
( ) ~~> está vendo que dentro dos parênteses não há nada?
Então... é dentro deles que você vai especificar qual letra deve ser substituída, e qual entrará no lugar dela!
No nosso caso, queremos que as letras "a" sejam substituídas por qualquer outra (digamos, a letra "u"). Então, como fazer?
(/a/g,"u");
Siga sempre este esquema:
(/caractere ou letra que você deseja que saia entre barras/g , "caractere ou letra que você quer que entre no lugar entre aspas");
Você pode testar diversas combinações... Exemplos:
.replace(/e/g,"f"); ~~> trocará as letras "e" pela letra "f"
.replace(/m/g,"d"); ~~> trocará as letras "m" pela letra "d"
.replace(/u/g,"5"); ~~> trocara as letras "u" pelo número "5"
.replace(/4/g,"$"); ~~> trocará os números "4" pelo símbolo de dinheiro "$" (cifrão)
Bom, o resto é uma questão de lógica. Se você quer que o texto apareça no menu "alert()", é só colocar a variável "x.value" dentro dele, para que seu valor apareça no menu.
javascript:x=document.getElementsByTagName('textarea')[0];x.value=x.value.replace(/a/g,"u");alert(x.value);void(0);
Agora teste o js na página de postar, e digite algo na caixa de texto antes de usá-lo. Se o que você digitou tiver alguma letra "a" no meio, a letra virará "u" !!!!
AVISO: Não passe para esta parte sem ter entendido as outras. Isto é muito importante, para que você não se perca. Se ainda tem dúvidas sobre alguma coisa, vá ao tópico de dívidas e faça a sua pergunta.
Antes de mais nada, gostaria de informar que, quando eu escrever "js", na verdade, estarei me referindo à "javascript".
============================================================
Agora que já estamos um pouco "avançados", eu devo explicar uma coisa muito importante.
Nós estamos acostumados à ver js bem pequenos, e quase sempre, com comandos bem juntinhos um do outro... como neste exemplo:
javascript:a=document.getElementsByTagName('textarea')[0];a.value+="\n\n______________\nGaara \nBlue";alert(a.value);void(0);
O que eu devo explicar nesse momento, é que um js não é escrito assim. O modo correto de se escrever o js acima seria assim:
a = document.getElementsByTagName('textarea')[0];
a.value += "\n\n______________\nKing \nOf \nThe \nSystem";
alert(a.value);
void(0);
Vocês entenderam? A cada comando, deve-se pular uma linha. Lembrando que o ponto e vírgula ( ; ) é quem separa estes comandos...
E na escrita de um js, você não pode começar com o termo "javascript:" . Este termo só é usado para javascripts que serão usados na barra de endereços (onde se digita o www...).
Por isto, é melhor vocês se acostumarem com a nova maneira de escrever o js, pois esta é a maneira correta.
by: King Of The System
Viram essa parte do post?
========================================
A gente costuma chamar isso aí de "assinatura"... pois vêm sempre no final do post, e geralmente com o seu nome, e uma frase ou texto qualquer...
Eu não digitei isso, ele apareceu sozinho; apenas usei um javascript!
A questão é:
Como programar um javascript, para sempre inserir a sua assinatura no final do post?
Sabendo que depois que você digita a mensagem, você teria de usar o código para ele inserir o seu nome, então:
a = document.getElementsByTagName('textarea'
a.value;~~> Isso irá pegar todo o texto que você digitou... Porquê?
Por que esta parte irá pegar o valor da caixa de texto onde você digita o post (sendo "a" a caixa de texto e "a.value", o seu valor)...
Você quer que a assinatura apareça no código. Você pode dar a ela, uma variável:
ass = "_________________ By King Of The System";
ass ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~> variável
"_________________ By King Of The System" ~~> frase
========================================
Imagine agora: Você quer "somar" o texto que você digitou, com a assinatura (no caso a minha, você pode fazer a sua) no final do texto; ou seja, o texto digitado, mais a assinatura deverão ser um texto só...
Então, se "a.value" é o valor da caixa de texto (aquilo que você digitou) e "ass" é a sua assinatura, somar os dois seria assim:
a.value + ass;
Aí você fala, pô mais isso é difícil demais! Não é não, apenas preste bastante atenção:
a.value ~~> valor da caixa de texto
ass ~~~~> assinatura
Tá, somamos os dois textos. E para fazer ele aparecer no post?
Se o valor da caixa de texto é "a.value", e você quer que esse valor seja igual ao texto somado ali em cima...
Explicando por partes:
a.value = a.value + ass;
#¨¨¨¨#¨¨¨#¨¨#¨¨###> a assinatura
#¨¨¨¨#¨¨¨#¨¨#
#¨¨¨¨#¨¨¨#¨¨###> mais...
#¨¨¨¨#¨¨¨#
#¨¨¨¨#¨¨¨###> ao valor atual da própria caixa de texto...
#¨¨¨¨#
#¨¨¨¨###> é igual...
#
########> o valor da caixa de texto...
========================================
Agora é só finalizar o código com o "void(0);"...
Código finalizado:
javascript: a = document.getElementsByTagName('textarea'
Quando você usar este código na página de postar, você vai perceber que ele não pulou linhas... ficou meio "desorganizado"... Porquê?
Por que não pensamos em pular a linha. Para pular linhas, você deve usar o caractere \n .
Ele pulará a linha, e o que estiver escrito depois dele irá para a linha debaixo.
Então...
ass = "\n\n_________________ \nBy King\nOf\nThe\nSystem";
Perceba que logo no início, eu usei o caractere \n duas vezes (\n\n). Isto fará com que a assinatura seja colocada duas linhas abaixo do texto que você digitou...
Agora eu vou refazer o javascript, com a nova assinatura, pulando linhas:
javascript: a = document.getElementsByTagName('textarea'
PRONTO!
Use o javascript na página de postar as mensagens, depois de ter escrito alguma coisa... ele aparecerá lá automaticamente!
Se você já entendeu a propriedade "value", que retorna ou atribui valor à alguma coisa, será interessante que aprenda-mos o método "replace()".
Para que serve o método "replace()" ?
A tradução de "replace()" é: substituir. Ou seja, o método "replace()" serve para substituir algum caractere por outro. Todas as ocorrências do caractere no texto atribuído serão substituídas pela sua escolha no "replace()" . Por exemplo, se você quiser trocar todas as letras "a" de um texto para a letra "e", o método "replace()" é o usado para essa tarefa.
Como usar o método "replace()" (síntaxe):
A primeira coisa a dizer, é que o método deve ser usado depois de uma variável ou propriedade.
Exemplos:
a.replace(...);
pi.replace(...);
b.value.replace(...);
c.value.replace(...);
As variáveis estão em vermelho, a propriedade "value" em verde e o método "replace(...)" em azul.
MUITO IMPORTANTE!!!: Observe que entre as variáveis e as propriedades existe um . (ponto):
c . value . replace(...);
O ponto serve para "concatenar" ou "juntar" as coisas no código. Juntar variáveis com propriedades ou métodos... para que não fique desorganizado.
Como o método "replace()" substitui os caracteres?
Vamos pegar um exemplo bem simples, o de trocar todas as letras "a" de uma coisa que você digitar na caixa de texto:
javascript:x=document.getElementsByTagNa
Este js deve ser testado na página de postar...
Como faríamos para trocar as letras "a" do que foi digitado é fácil. A variável "x" guardou a frase dentro dela. Logo, o valor da variável "x" é "x.value" . Se nós queremos substituir todas as letras "a" da frase, seria a mesma coisa dizer que queremos substituir as letras "a" do valor da variável "x" . Assim:
x.value.replace(...);
x ~~> variável "x"
x.value ~~> O valor da variável "x" (aquela frase...)
x.value.replace(...) ~~> substituir o valor da variável "x"
Tá, chegamos à parte principal. Agora, como fazer para que o método "replace()" substitua apenas as letras "a" por uma outra letra qualquer?
.replace();
( ) ~~> está vendo que dentro dos parênteses não há nada?
Então... é dentro deles que você vai especificar qual letra deve ser substituída, e qual entrará no lugar dela!
No nosso caso, queremos que as letras "a" sejam substituídas por qualquer outra (digamos, a letra "u"). Então, como fazer?
(/a/g,"u");
Siga sempre este esquema:
(/caractere ou letra que você deseja que saia entre barras/g , "caractere ou letra que você quer que entre no lugar entre aspas");
Você pode testar diversas combinações... Exemplos:
.replace(/e/g,"f"); ~~> trocará as letras "e" pela letra "f"
.replace(/m/g,"d"); ~~> trocará as letras "m" pela letra "d"
.replace(/u/g,"5"); ~~> trocara as letras "u" pelo número "5"
.replace(/4/g,"$"); ~~> trocará os números "4" pelo símbolo de dinheiro "$" (cifrão)
Bom, o resto é uma questão de lógica. Se você quer que o texto apareça no menu "alert()", é só colocar a variável "x.value" dentro dele, para que seu valor apareça no menu.
javascript:x=document.getElementsByTagNa
Agora teste o js na página de postar, e digite algo na caixa de texto antes de usá-lo. Se o que você digitou tiver alguma letra "a" no meio, a letra virará "u" !!!!
AVISO: Não passe para esta parte sem ter entendido as outras. Isto é muito importante, para que você não se perca. Se ainda tem dúvidas sobre alguma coisa, vá ao tópico de dívidas e faça a sua pergunta.
Antes de mais nada, gostaria de informar que, quando eu escrever "js", na verdade, estarei me referindo à "javascript".
========================================
Agora que já estamos um pouco "avançados", eu devo explicar uma coisa muito importante.
Nós estamos acostumados à ver js bem pequenos, e quase sempre, com comandos bem juntinhos um do outro... como neste exemplo:
javascript:a=document.getElementsByTagNa
O que eu devo explicar nesse momento, é que um js não é escrito assim. O modo correto de se escrever o js acima seria assim:
a = document.getElementsByTagName('textarea'
a.value += "\n\n______________\nKing \nOf \nThe \nSystem";
alert(a.value);
void(0);
Vocês entenderam? A cada comando, deve-se pular uma linha. Lembrando que o ponto e vírgula ( ; ) é quem separa estes comandos...
E na escrita de um js, você não pode começar com o termo "javascript:" . Este termo só é usado para javascripts que serão usados na barra de endereços (onde se digita o www...).
Por isto, é melhor vocês se acostumarem com a nova maneira de escrever o js, pois esta é a maneira correta.
OPERADORES
==========
O que são operadores?
RS: Operadores são símbolos que desempenham diversas funções nas linguagens de programação. Os primeiros operadores a se aprender, são os que desempenham funções matemáticas, os chamados Operadores Aritméticos.
===========================================================
Lista de operadores aritméticos:
+ ~~> realiza somas entre números, ou concatena frases (ou strings... veja abaixo sobre concatenação...);
- ~~> realiza subtrações;
* ~~> realiza multiplicações;
/ ~~> realiza divisões;
++ ~~> operador de incremento;
-- ~~> operador de decremento;
===========================================================
Bom, acho que os operadores de subtração, multiplicação e divisão eu não preciso explicar suas funções. Vamos entender o que faz o operador de soma ou "concatenação".
a = 2;
b = 3;
alert (a + b);
No exemplo acima, os valores das variáveis "a" e "b" serão somados, e o novo valor será mostrado no menu "alert()". No caso, aparecerá o número 5 (2 + 3).
Agora, veja o js abaixo:
a = "mentes ";
b = "hacker";
alert (a + b);
O temos agora? Os valores "a" e "b" não são mais números. O que vai acontecer agora? Eu respondo. As frases (strings) "Estamos na comunidade " e "Códigos e Javascripts para o Orkut®" serão "concatenadas", ou seja, elas ficarão juntas. O que aparecerá no menu "alert()" será uma frase (string) só: "Mentes hacker".
OPERADORES DE INCREMENTO E DECREMENTO
===================================
++ / -- ~~> Operadores de incremento/decremento
Eles servem para que o javascript "aumente" uma variável em unidades, ou "somar mais 1" ou "diminuir 1". Fica mais fácil se eu der um exemplo:
a = 2; // Define que "a" será igual à 2
a++; // Incrementa "a", fazendo ela virar 3
alert(a); // Mostra no menu, o valor de "a" (3)
javascript: a=2; a++; alert(a);
Com o operador de decremento é a mesma coisa:
b = 5; // Define que "b" será igual à 5
b--; // Decrementa "b", fazendo ela virar 4
alert(b); // Mostra no menu, o valor de "b" (4)
javascript: b=5; b--; alert(b);
OPERADOR DE MÓDULO
==================
% ~~> Operador de módulo
Este operador com o símbolo de porcentagem tem uma função: retornar o módulo entre espressões. Ai você pergunta: mas o que é módulo? Eu explico: Módulo na matemática é o resto da divisão entre dois números. Um exemplo:
10/2 = 5 ~~~~~~~> módulo = 0 (não tem resto, a divisão é exata)
10/3 = 3 resto 1 ~~> módulo = 1 (porque 3x3 = 9+1 = 10)
10/4 = 2 resto 2 ~~> módulo = 2 (porque 4x2 = 8+2 = 10)
Em javascript não é diferente:
Exemplo com números:
javascript: alert(20%3); // Mostra o resto da divisão entre 20/3 (2)
Exemplo com variáveis:
a = 16; // Define que "a" seja 16
b = 5; // Define que "b" seja 5
c = a % b; // Define que "c" seja igual ao resto da divisão entre 16/5 (1)
alert(c); // Mostra o valor de "c" , resto da divisão
javascript: a=16; b=5; c=a%b; alert(c);
COMENTÁRIOS
============
Como eu já tinha dito antes, um javascript deve escrito de cima para baixo; pulando uma linha por comando. Acontece é que algumas vezes, você deseja escrever algum comentário no meio do javascript, sem que ele interfira no script. Para fazer isto, temos dois métodos:
// ~~> Para fazer uma única linha de comentário;
/*...*/ ~~> Para fazer várias linhas de comentários;
Exemplo do uso de comentários em script:
alert("Digite a equação da forma (a + b)²"); // Esta é uma linha de comentário simples
a = eval(prompt("Digite o A:",""));
b = eval(prompt("Digite o B:",""));
/* Estas são várias linhas de comentário. Elas não serão usadas no javascript, e só servem para você escrever alguma nota, algo para que você possa entender o que está fazendo depois... */
c = a + b;
resultado = eval(c*c);
alert("Resultado: "+ resultado);
Javascript pronto, para se usar na barra de endereços... (onde digita www...):
javascript:alert("Digite a equação da forma (a + b)²");a = eval(prompt("Digite o A:"));b = eval(prompt("Digite o B:"));c = a + b;resultado = eval(c*c);alert("Resultado: "+ resultado);
OBS: Nos comentários, só será comentário o que estiver na frente do símbolo //. O que estiver antes não será comentário (e o comentário acaba quando pular a linha).
E com o símbolo /*...*/, só será comentário o que estiver entre os símbolos /* e */ (e o comentário não acaba ao pular linha). Exemplo:
Aqui não é um comentário. // Aqui é um comentário.
Aqui não é um comentário.
/* Aqui são
várias linhas de
comentário xD */
E aqui já não é comentário, porque eu já fechei ele ali em cima com o */
Entenderam ¿
Há outros tipos de operadores a serem aprendidos. Mas antes de estudá-los, devemos aprender outras coisas, para facilitar o entendimento deles.
Creditos: Christiam nenem... Equipe Mentes Hacker!
==========
O que são operadores?
RS: Operadores são símbolos que desempenham diversas funções nas linguagens de programação. Os primeiros operadores a se aprender, são os que desempenham funções matemáticas, os chamados Operadores Aritméticos.
========================================
Lista de operadores aritméticos:
+ ~~> realiza somas entre números, ou concatena frases (ou strings... veja abaixo sobre concatenação...);
- ~~> realiza subtrações;
* ~~> realiza multiplicações;
/ ~~> realiza divisões;
++ ~~> operador de incremento;
-- ~~> operador de decremento;
========================================
Bom, acho que os operadores de subtração, multiplicação e divisão eu não preciso explicar suas funções. Vamos entender o que faz o operador de soma ou "concatenação".
a = 2;
b = 3;
alert (a + b);
No exemplo acima, os valores das variáveis "a" e "b" serão somados, e o novo valor será mostrado no menu "alert()". No caso, aparecerá o número 5 (2 + 3).
Agora, veja o js abaixo:
a = "mentes ";
b = "hacker";
alert (a + b);
O temos agora? Os valores "a" e "b" não são mais números. O que vai acontecer agora? Eu respondo. As frases (strings) "Estamos na comunidade " e "Códigos e Javascripts para o Orkut®" serão "concatenadas", ou seja, elas ficarão juntas. O que aparecerá no menu "alert()" será uma frase (string) só: "Mentes hacker".
===================================
++ / -- ~~> Operadores de incremento/decremento
Eles servem para que o javascript "aumente" uma variável em unidades, ou "somar mais 1" ou "diminuir 1". Fica mais fácil se eu der um exemplo:
a = 2; // Define que "a" será igual à 2
a++; // Incrementa "a", fazendo ela virar 3
alert(a); // Mostra no menu, o valor de "a" (3)
javascript: a=2; a++; alert(a);
Com o operador de decremento é a mesma coisa:
b = 5; // Define que "b" será igual à 5
b--; // Decrementa "b", fazendo ela virar 4
alert(b); // Mostra no menu, o valor de "b" (4)
javascript: b=5; b--; alert(b);
OPERADOR DE MÓDULO
==================
% ~~> Operador de módulo
Este operador com o símbolo de porcentagem tem uma função: retornar o módulo entre espressões. Ai você pergunta: mas o que é módulo? Eu explico: Módulo na matemática é o resto da divisão entre dois números. Um exemplo:
10/2 = 5 ~~~~~~~> módulo = 0 (não tem resto, a divisão é exata)
10/3 = 3 resto 1 ~~> módulo = 1 (porque 3x3 = 9+1 = 10)
10/4 = 2 resto 2 ~~> módulo = 2 (porque 4x2 = 8+2 = 10)
Em javascript não é diferente:
Exemplo com números:
javascript: alert(20%3); // Mostra o resto da divisão entre 20/3 (2)
Exemplo com variáveis:
a = 16; // Define que "a" seja 16
b = 5; // Define que "b" seja 5
c = a % b; // Define que "c" seja igual ao resto da divisão entre 16/5 (1)
alert(c); // Mostra o valor de "c" , resto da divisão
javascript: a=16; b=5; c=a%b; alert(c);
COMENTÁRIOS
============
Como eu já tinha dito antes, um javascript deve escrito de cima para baixo; pulando uma linha por comando. Acontece é que algumas vezes, você deseja escrever algum comentário no meio do javascript, sem que ele interfira no script. Para fazer isto, temos dois métodos:
// ~~> Para fazer uma única linha de comentário;
/*...*/ ~~> Para fazer várias linhas de comentários;
Exemplo do uso de comentários em script:
alert("Digite a equação da forma (a + b)²"); // Esta é uma linha de comentário simples
a = eval(prompt("Digite o A:",""));
b = eval(prompt("Digite o B:",""));
/* Estas são várias linhas de comentário. Elas não serão usadas no javascript, e só servem para você escrever alguma nota, algo para que você possa entender o que está fazendo depois... */
c = a + b;
resultado = eval(c*c);
alert("Resultado: "+ resultado);
Javascript pronto, para se usar na barra de endereços... (onde digita www...):
javascript:alert("Digite a equação da forma (a + b)²");a = eval(prompt("Digite o A:"));b = eval(prompt("Digite o B:"));c = a + b;resultado = eval(c*c);alert("Resultado: "+ resultado);
OBS: Nos comentários, só será comentário o que estiver na frente do símbolo //. O que estiver antes não será comentário (e o comentário acaba quando pular a linha).
E com o símbolo /*...*/, só será comentário o que estiver entre os símbolos /* e */ (e o comentário não acaba ao pular linha). Exemplo:
Aqui não é um comentário. // Aqui é um comentário.
Aqui não é um comentário.
/* Aqui são
várias linhas de
comentário xD */
E aqui já não é comentário, porque eu já fechei ele ali em cima com o */
Entenderam ¿
Há outros tipos de operadores a serem aprendidos. Mas antes de estudá-los, devemos aprender outras coisas, para facilitar o entendimento deles.
Creditos: Christiam nenem... Equipe Mentes Hacker!
0 comentários:
Postar um comentário