Depois que deu o click em ADD abriar essa janelinha e vc vai colocar esses nomes ai igual o da imagem abaixo.
Tutorial resolvido o problema de audio no backtrack 5 r3 gnome
Depois que deu o click em ADD abriar essa janelinha e vc vai colocar esses nomes ai igual o da imagem abaixo.
Usando Reaver para explorar falha do WPS e acessar redes com criptografia WPA/WPA2
Na média Reaver irá conseguir a senha de acesso dos APs em texto puro em cerca de 4 a 10 horas, dependendo do AP. Na prática, irá levar metade desse tempo para adivinhar o PIN WPS correto e conseguir a senha acesso.
Instalação:
Para quem ainda não tem o reaver instalado no Backtrack basta usar o seguinte comando para instalar:
# apt-get install reaver Requisitos para usar o Reaver
- Estar usando Linux
- Ter uma placa wireless capaz de fazer injeção raw
- Ter uma placa wireless capaz de trabalhar em modo monitor
Como usar:
Primeiro coloque sua placa de rede em modo monitor
# airmon-ng start wlan0Encontre o BSSID do roteador que você quer acessar:
# airodump-ng wlan0Se o comando acima não funcionar tente:
# airodump-ng mon0 Você irá ver uma lista de redes wireless ao seu alcance, a sua lista será parecida com essa:
Quando visualizar a rede desejada pressione Control+C e então copie o BSSID da mesma. A rede deve possuir encriptação WPA ou WPA2 .
Agora com o BSSID e o nome da interface que está monitorando em mãos, tudo que você precisa é iniciar o Reaver.
Executando o Reaver
# reaver -i inteface_monitorando -b bssid -vvpor exemplo:
# reaver -i mon0 -b 00:0C:42:68:57:E6 -vv Pressione enter, sente-se e deixe o Reaver trabalhar. Reaver irá tentar uma série de PINs no roteador através de um ataque de força bruta. Isso vai levar um bom tempo, em média o Reaver demora de 2 a 4 horas para lhe entregar a senha.
Reaver funciona muito bem em diversos roteadores, mas não necessariamente irá funcionar em todos. Você pode pausar o processo pressionando Control+C, mas o Reaver irá salvar o seu progresso e irá continuar na próxima vez que executar.
fonte: http://sviehb.wordpress.com/2011/12/27/wi-fi-protected-setup-pin-brute-force-vulnerability/
Crack automático de redes Wireless com Backtrack (WEP, WPA/WPA2)
Veja abaixo detalhes sobre a ferramenta:
Wiffy nada mais é do que um script bash para automatizar o processo de crack de uma rede WiFi. Suporta WEP , WPA/WPA2, filtragem de MAC e SSID oculto.
Como funciona ?
* Escaneia por redes wireless e salva os dados obtidos
* Configura a placa de rede
* Tenta detectar clientes conectados
* Inicia a captura de dados
* Dependendo do tipo da encriptação da rede wireless – inicia ataque de acordo com o tipo da rede.
* Após dados serem coletados inicia o processo de quebra da chave WiFi
O que você precisa?
* o script bash: wiffy.sh
* uma placa wireless — que suporta modo monitor
* Dicionários/Lista de palavras — para usar com WPA/WPA2
* aircrack-ng suite, macchanger — tudo isso já disponível no su Backtrack!
Como usar:
1. Edit wiffy.sh, via linha de comando, e especifique o nome da sua interface. (Você pode ver o nome via ifconfig e usar o Vi para editar. o padrão é wlan0)
2. Especifique o caminho e nome da sua wordlist: wordlist=”wpa.txt”
3. No wiffy.sh localize ”/usr/bin/macchanger” e altere para “/usr/local/bin/macchanger”
4. Selecione o ESSID ou BSSID
5. Espere …
6. Pronto !!!
Baixar Script : (wiffy.sh): http://www.mediafire.com/?nmu7mixhis1u8km
Baixar versão 0.2 beta : wiffy.sh v0.2 (#0 BETA #6) ~ 2011-03-17 fonte: www.thinklinux.com.br
Instalando o Tor Browser 2.3.25-1 no seu Ubuntu (navegação anônima)
- Implementação do Cliente Tor 0.2.3.25 (with openssl-1.0.1c, zlib-1.2.7 and libevent-2.0.20-stable)
- Navegador baseado no Firefox 10.0.11esr
- Vidalia 0.2.21, a plataforma gráfica para conexão com a Rede Tor
- NoScript 2.6.2, um bloqueador de conteúdo executável, como Java, JavaScript e Flash
- HTTPS-Everywhere 3.0.4, para aumentar a sua segurança
Instalação
Sistemas 32 bits:sudo add-apt-repository ppa:upubuntu-com/tor
sudo apt-get update
sudo apt-get install tor-browser
sudo chown $USER -R ~/.tor-browser/Sistemas 64 bits
sudo add-apt-repository ppa:upubuntu-com/tor64
sudo apt-get update
sudo apt-get install tor-browser
sudo chown $USER -R ~/.tor-browser/Após isso, é só pesquisar por “Tor” nos seus aplicativos ou iniciá-lo via terminal, com o comando:
tor-browserE se você quiser desinstalar o Tor Browser, use uma das formas abaixo:
sudo add-apt-repository –remove ppa:upubuntu-com/torou
sudo add-apt-repository –remove ppa:upubuntu-com/tor64
sudo apt-get remove tor-browser
sudo apt-get update
Anonimidade online com I2P
Ao contrário de alguns multi-proxies, o I2P lhe permitirá criar túneis criptografados em várias aplicações, não só navegar na Web, tornando-se assim um protocolo muito robusto. O I2P está disponível para todas as plataformas, não apenas Linux.
O I2P e o Tor
Alguém poderia provavelmente ver o I2P como um exagero, sem saber as quedas de seus predicessor. O Tor foi uma ferramenta maravilhosa, usada para esconder endereços ip que saltavam em servidores de todo o mundo, se mostrando muito confiável. Tudo isso pareceu mudar depois de um artigo que foi publicado em 2006 no Hacker Quartley. Um autor expôs como se tornar um “nó de saída” para a rede Tor, permitido que todo o tráfego da rede Tor passasse através de sua máquina. Tornando-se um nó de saída, era o mesmo que realizar um ataque Man-In-The-Middle. Tudo o que tinha que fazer era abrir um packet sniffer e ver todo o tráfego passando.O Tor ainda é usado por pessoas que tentam proteger sua privacidade, mas, ao mesmo tempo, tornou-se um parque de diversões para os hackers e para os governos monitorarem o que eles consideram suspeitos. O I2P corrigiu este problema ao adicionar mais funcionalidades.
Como o I2P funciona?
O I2P usa criptografia empacotada para mais de um multi-proxy, assim como o Tor. Os pacotes são “encaminhados” em todo o globo para qualquer pessoa usando I2P. No entanto, os pacotes são criptografados com ElGamal e criptografia AES, usando esta criptografia “fim a fim”. Nada é descriptografado ao longo do caminho do pacote, somente o remetente e o destinatário são capazes de fazê-lo.Uma vez dentro, os endereços ip de rede não são os mesmos. O nó é atribuído a um endereço de texto ilegível para usar como um identificador. O I2P também é uma rede descentralizada. Cada cliente é também um servidor na rede. Isso corrige o fato de terem nós de rede, que podem gerar falhas e comprometer o anonimato. Existem toneladas de documentos no painel de controle do I2P explicando isso mais a fundo.
O que o I2P suporta?
Existem muitas aplicações que suportam o protocolo I2P, inclusive SSH. Devido a isso, você pode fazer muitas coisas com ele. Você pode usá-lo para túnel de SMTP e POP3 para e-mail anônimo, por exemplo. Você pode usá-lo para os clientes de chat e P2P, dentre muitos outros.Instalação
Antes de começar, você deve ter certeza de que o Java 1.5 ou superior está instalado. Se não, instale-o agora.# apt-get install openjdk-7-jrePara Debian e Ubuntu, os repositórios são estes:
# The actual repo for i2p on Debian, even though its ubuntu deb http://ppa.launchpad.net/i2p-maintainers/i2p/ubuntu natty main deb-src http://ppa.launchpad.net/i2p-maintainers/i2p/ubuntu natty mainAgora nós atualizaremos nossos pacotes e usaremos o apt-get para instalar o I2P.
# apt-get update # apt-get install i2pAgora que o pacote foi instalado, ainda temos mais umas coisas para configurar. Por padrão, o i2p é executado na porta 20000. Se você estiver usando um firewall NAT, não esqueça de abrir essa porta nas configurações do seu roteador. Dependendo de como o iptables está configurado em seu sistema operacional, você tem que permitir lá também. Aqui estão alguns comandos iptables que irão permitir o tráfego com TCP e UDP naquela porta.
iptables -I INPUT 1 -i wlan0 -p tcp --tcp-flags SYN,RST,ACK SYN --dport 20000 -m conntrack --ctstate NEW -j ACCEPT iptables -I INPUT 1 -i wlan0 -p udp --dport 20000 -m conntrack --ctstate NEW -j ACCEPTComo você pode ver aqui, eu estou especificando wlan0 como a interface para aplicar esta regra. Você pode precisar fornecer uma interface diferente ou remover essa para tornar aplicável a todas as interfaces. Eu vou te mostrar depois como alterar a porta que o i2p está usando. Por agora, precisamos iniciá-lo. A última coisa que precisamos fazer é iniciar o nosso roteador i2p. Isto é o que vamos fazer cada vez para iniciar e para parar o i2p na nossa máquina.
$ sh /usr/bin/i2prouter start Starting I2P Service... Waiting for I2P Service..... running: PID:26163Vá até http://127.0.0.1:7657/ em seu navegador depois de alguns segundos. Você deve ver algo como mostrado na imagem abaixo.
No painel esquerdo, há uma sessão “Peers”. O console i2p sugere que você tenha pelo menos dez peers ativos antes de tentar começar. No entanto, dependendo da velocidade de conexão dos seus peers, isso pode não ser suficiente para conectar a uma página web. O ideal é algo entre 40-60 peers para começar.Talvez demore um pouco, é normal.
Após isso, o próximo passo será testar a rede. O próprio console vai se encarregar disso e lhe mostrar o andamento no painel esquerdo em “Network”. Em poucos segundos você verá um “Ok” ou “Firewalled”, isso significa que o I2p não está conseguindo passar através do seu firewall.
Na seção “Tunnels” é onde você deve ver aceitar ou rejeitar os túneis de conexão. Estas são auto-explicativas.
Você também pode clicar no Bandwidth In / Out para configurar a velocidade de upload e download que você gostaria de trabalhar. Tenha em mente que isso não afetará somente você, mas toda a rede. Você também pode configurar a porta que você quiser para ser executada no i2p nesta seção. Usando o padrão, será fácil de um invasor descobrir o que você está executando e “cavar” uma vulnerabilidade. Uma vez que temos peers bastantes, só precisamos configurar o navegador para usar o proxy.
Fonte: how-to.linuxcareer.com
Curso de Javascript (parte 6)
Para começar, abra novamente o console do seu navegador e vamos praticar:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | // as dicas continuam as mesmas do último post, e eu acrescento essa:// para criar uma nova linha no Chrome e no Firefox (menos no Firebug)// você pode usar [SHIFT] + [ENTER]// para declarar uma função:function nome_da_funcao(param1, param2){ // aqui você faz alguma coisa útil alert(param1); // exibe o primeiro parâmetro alert(param2); // exibe o segundo parâmetro}// para executar a função:nome_da_funcao('primeiro', 2);// não é necessário passar todos os parâmetros, o seguinte é válido:nome_da_funcao(1); // o segundo valor será undefinednome_da_funcao(); // os dois valores serão undefined |
Outro detalhe interessante em Javascript: uma variável pode armazenar uma função, ou seja:
1 2 3 4 5 6 7 | var funcao = function() { alert("Essa função não faz nada");}// executando:funcao();funcao(1286, 'bla bla bla'); // parâmetros a mais? nada contra... |
Isso cria uma nova possibilidade: funções dentro de objetos, ou seja, métodos (lembrou de programação orientada a objetos? Então chegamos ao ponto interessante!).
Embora Javascript seja considerada por alguns “programadores” como uma linguagem sem orientação a objetos, Javascript utiliza sim alguns conceitos desse método de programação: classes (protótipos), atributos (propriedades), métodos (funções), herança, sobrecarga de métodos, public, private… alguns desses itens podem não ser tão fáceis de implementar como seria em C++, PHP, Java, etc., outros podem até ser mais simples!
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | // construtor para uma "classe" Pessoa:function Pessoa() { // definindo as propriedades para o objeto e // inicializando com valores padrão: this.nome = ""; this.idade = 0; // criando métodos this.setNome = function(nome){ this.nome = nome; }; this.getIdade = function(){ return this.idade; };}// usando essa classe:var joao = new Pessoa();joao.setNome("João");// não é preciso utilizar métodos para atualizar as propriedades:joao.idade = 33;joao.nome += " da Silva"; // joao.nome = "João da Silva"// o construtor também pode receber parâmetros, para facilitar o trabalhofunction Carro(marca) { this.marca = marca; this.modelo = ""; this.ano = undefined;}var ferrari = new Carro("Ferrari");// ferrari.marca == "Ferrari"; |
Essas características vamos ver com mais detalhes nos próximos posts. Essa foi apenas uma introdução para mostrar uma ideia geral do que é possível fazer com Javascript, que não deixa nada a desejar a outras linguagens em questão de Orientação a Objetos.
Curso de Javascript (parte 5)
Para começar, abra o console Javascript (em qualquer página que estiver, pode ser nessa mesmo).
No Chrome (Ctrl+Shift+J), o console deve parecer com isso na parte inferior da página:
No Firefox (Ctrl+Shift+K), deve ser exibido como o seguinte no topo da página:
Ou o Firebug, também exibido na parte inferior da página:
Escolha o que mais lhe agradar. Então, vamos começar. Provavelmente você precise limpar o console (dependendo da página aberta). Para isso, no Chrome digite clear() seguido de [enter]. No Firefox e no Firebug, digite console.clear() e [enter].
// linhas que começam com duas barras são comentários e não serão executadas // o ponto e vírgula ; no final da linha é opcional, mas aqui vou utilizar para // indicar que você deve teclar [enter] // declarando uma variável (que pode conter qualquer tipo de dados) var nome_da_variavel; // declarando e inicializando ao mesmo tempo var string = 'isso é uma string'; // para exibir o conteúdo de uma variável, digite o nome e tecle [enter]: string; // exibe: "isso é uma string" // concatenando (juntando) strings var string1 = "início "; var string2 = "- fim"; var final = string1 + string2; // a variável final é igual a "início - fim"
Objetos
A linguagem Javascript permite criar objetos, que podem conter propriedades e funções ou métodos (lembra orientação a objetos, não? ;-)). Os objetos podem ser criados de duas formas: com construtor ou declarando-o como um objeto (vazio ou não).
// com construtor:var objeto = new Object();// criando um objeto indiretamente:var objeto = {};// é possível criar um objeto com propriedades iniciais, mas no console// isso é meio complicado pois temos apenas uma linha para digitar// dica: digite tudo igual mas use espaço ao invés de entervar objeto = { propriedade: 'valor', outra_propriedade: 123};// acessando uma propriedadeobjeto.propriedade = "novo valor";
Como podemos ver, dentro de um objeto as propriedades podem ser de qualquer tipo válido, incluindo outros objetos (e esses podem conter outros, e outros..), arrays, funções (veremos funções no próximo post), enfim, qualquer coisa válida em Javascript.
Arrays
Semelhante aos objetos, os arrays também podem ser criados de duas formas:
// com construtor:var array = new Array();// criando um array vazio:var array = [];// declarar um array com valores iniciais:var array = [12, "t", 'Seja Livre', new Object(), {posicao: 4}];// acessando um valor do array:var posicao3 = array[3];
O que vimos hoje já é o básico necessário para um programador Javascript iniciante, no próximo post vamos ver outro ponto importante da linguagem: declaração e uso de funções.
Curso de Javascript (parte 4)
A Web é um espaço muito dinâmico principalmente devido às características do Javascript. Tão dinâmico que você nem precisa editar o código da página para poder alterar algum detalhe, é possível fazer isso através do console Javascript do navegador – claro que assim que você fechar a página as alterações se perdem, mas para testes é muito melhor do que editar o código, salvar e recarregar a página para ver as alterações ;-).
O objetivo desse post é justamente se habituar a usar essas ferramentas disponíveis para testar e descobrir coisas novas. No Google Chrome/Chromium, o conjunto de ferramentas do desenvolvedor disponíveis é completo, sem ser necessário instalar nenhuma extensão. No Firefox, é provável que você precise instalar o Firebug, que complementa as opções já disponíveis no navegador. O Firebug também possui uma versão para o Chrome, mas não é tão completa quanto o conjunto de ferramentas padrão do navegador.
Vamos a um exemplo. Imagine que você tenha a seguinte página em HTML:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <!DOCTYPE html><html> <head> <title>Página de testes</title> <style type="text/css"> #teste{ width: 500px; height: 200px; background-color: #AD91DA; color: #FD65CA; } </style> </head> <body> <div id="teste">Teste</div> <body></html> |
Essa é sua página HTML, mas você quer testar outras cores de fundo na DIV “teste” sem ter que editar o código. Simples:
1. abra o console Javascript (no Chrome: Ctrl+Shift+I ou Ctrl+Shift+J; no Firefox: Ctrl+Shift+K; Firebug: clique no ícone da extensão)
2. no console, digite:
document.getElementById('teste').style.backgroundColor = '#C04' <enter> |
Da mesma forma, você pode testar qualquer outro código Javascript no console. O resultado será o mesmo do que se ele estive incluído na sua página, sem no entanto ser necessário alterar os arquivos. Isso é útil para testar ideias sem que elas se “percam” dentro da sua página e fiquem esquecidas, talvez causando bugs.
Esse post foi apenas um aquecimento para os próximos, onde pretendo passar alguns exemplos que podem ser feitos via console, sem a necessidade de um arquivo HTML para implementar (mas como você viu aqui, o resultado será o mesmo). Com isso, esse mini-curso fica mais rápido e fácil de acompanhar, então vamos avançar um pouco mais na sintaxe do Javascript.
[Linux-Tutorial]Convertendo seus vídeo OGV (vídeo/OGG) criados com o recordMyDesktop
1) Instale um programa chamado recordMyDesktop para gravar sua tela e criar seus videos-tutoriais.
digitre no terminal
sudo apt-get install gtk-recordmydesktop
2) Depois de criado o video é preciso converter do formato .ogv para .avi.
Esse processo é necessário caso você queira publicar seus videos no youtube, caso contrário basta assistir seu novo video.
3) Converter seu video .ogv para .avi
No terminal digite:
mencoder -idx /home/faccaobnz/Desktop/nome_video.ogv -ovc lavc -oac mp3lame -o nome_video.avi
Se não funcionar instale os codecs necessários.
ou so muda a extensão pra .avi Pronto, só publicar seu video no youtube.
Crie sua própria distribuição linux baseada no Ubuntu
Com o Ubuntu Builder você pode fazer isso!
Baixe a última versão do Ubuntu Builder, instale-o e ai, é só abrir o programa.
Não criei uma distro Ubuntu Dicas
Bem, quem testar ai, me diga depois se é bom mesmo este trem?
Abraaaaços!
Video Aula de C++ - Parte 1
Encontrei essa Video Aula de C++.Achei fantastico e resolvi compartilhar com todos!
Dividirei em partes para que a pagina nao fique enorme e nem muito pesada!
Aula 1
Aula 2
Aula 3
Aula 4
Aula 5
Aula 6
Aula 7
Aula 8
Aula 9
Aula 10
Download Dev-C++
Download CodeBlock Windows
Download CodeBlock outros S.O.s
Por hoje eh isso.Espero que gostem!
Em breve Postarei a 2a Parte.
Fonte:C+descomplicado
lista de comandos basicos do linux
entao dei uma breve pesquisada no nosso velho amigo Google e achei duas listas
vou deixar os links aqui pq se nao o post se tornarar grande de mais e ia ter que
dividir por partes antao eu deixo os liks aqui comandos basicos do ubuntu aqui a outra lista que esta em ingles mais tem os Comandos do terminal de A a Z
OBS: no teminal diferencia as letras de maiuscula e menuscula fiquem atento nos comando qualquer comando errado pode prejudicar falha no seu sistema ou danificar de vez o systema operacional
Curso de Javascript (parte 3)
Para começar, precisamos de algumas ferramentas:
- se você ainda não tem um servidor instalado para testes, procure como instalar Apache + PHP + algum banco de dados (MySQL ou PostreSQL) na sua distribuição. Vamos precisar disso mais para frente.
- procure conhecer alguns Frameworks Javascript. Existem alguns muito utilizados que é praticamente impossível não conhecer.
- habitue-se com as ferramentas de desenvolvedor do seu navegador. No Chrome/Chromium, um conjunto completo de ferramentas já vem instalado. No Firefox, uma excelente alternativa é o Firebug.
Entre os frameworks Javascript, nessa série de posts pretendo utilizar inicialmente jQuery, por ser atualmente o mais utilizado no mundo. Você pode baixá-lo aqui e acessar a documentação aqui.
Para incluir a biblioteca jQuery na sua página, o código mais simples possível é esse:
1 2 3 4 5 6 7 | <html> <head> <script src="/path/to/jquery-1.7.1.min.js" type="text/javascript"></script> <!-- OU --> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> </head></html> |
Dentro da tag <head>, temos duas opções: adicionar o caminho do script que você baixou (ideal para desenvolvimento local), ou utilizar o acesso que a Google fornece livremente (e que muitos sites utilizam, sendo provável que o usuário já tenha uma cópia em cache desse arquivo e sua página deve carregar mais rápido).
Depois de incluir o jQuery na nossa página, vamos fazer alguma coisa com ele. Algo simples, como acessar a API do Youtube e pesquisar pelos 5 vídeos mais recentes sobre Linux:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | <html> <head> <script src="jquery-1.7.1.min.js" type="text/javascript"></script> </head> <body> <script type="text/javascript"> // isso será executado ao carregar a página $(document).ready(function() { // acessa a API do Youtube e pesquisa por vídeos sobre Linux // vamos usar o formato JSON para receber os resultados (o padrão é XML) $.get('http://gdata.youtube.com/feeds/api/videos?q=Linux&alt=json&max-results=5', function(result) { // esses são os resultados retornados na pesquisa var entries = result.feed.entry; // vamos exibir os dados de cada um $.each(entries, function(index, item) { var title = item.title.$t, // o título desc = item.content.$t, // a descrição link = item.link[0].href; // o link // exibindo os dados na página // aqui você poderia formatar a saída, adicionar estilos CSS, etc. // vamos só exibir de forma básica $('body').append('<h3><a href="' + link + '">' + title + '</a></h3><p>' + desc + '</p>'); }); }); }); </script> </body></html> |
Esse é um exemplo bem simples. Repare que ao exibir os dados nós não formatamos nada. Apenas exibimos o título com link para o vídeo e a descrição. Mas a API do Youtube retorna muito mais dados, como nome do usuário que postou o vídeo, data de publicação, e muito mais! Não é o nosso objetivo aprender a API do Youtube aqui, mas eu recomendo acessar diretamente a URL que utilizamos na requisição GET e estudar o retorno do Youtube para ver o que mais é possível (caso esteja interessado).
Espero que tenham entendido o exemplo. Caso algo não tenha ficado muito claro, comentem. Se tiverem alguma ideia, comentem também! Até o próximo post.
Curso de Javascript (parte 2)
Primeiro, o que é uma página dinâmica? De uma maneira simples, é uma página HTML com a capacidade de se atualizar (alterar os dados apresentados na tela) sem ser necessário recarregar a página. Antes, era necessário recarregar a página para que fosse possível consultar no banco de dados do servidor as novas informações a serem apresentadas. Hoje, isso pode ser feito utilizando-se tecnologias como AJAX para receber os dados em formato JSON ou XML e Javascript para interpretá-los.
Vejamos um exemplo: você está no Twitter, meu perfil por exemplo, quando alguém escreve algum tweet. O que você prefere: atualizar a página só para ler esse tweet, ou ver uma notificação onde só é necessário um clique para atualizar a timeline? A segunda opção, é claro. É nessa parte que entra o Javascript!
Vejamos um exemplo básico de como é possível alterar uma página dinamicamente:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | <!DOCTYPE html><html> <head> <title>Curso de Javascript do Blog infognosis</title> </head> <body> <form id="formulario" onsubmit="formSubmit(); return false;"> <label for="nome">Qual é o seu nome? </label> <input type="text" id="nome" placeholder="Digite o seu nome"> <input type="submit"> </form> <!-- uma div vazia, por enquanto... --> <div id="visitantes"> </div> <script type="text/javascript"> function formSubmit() { // pegando o valor digitado pelo usuário var nome = document.getElementById("nome"); // a div onde vamos exibir os dados var visitantes = document.getElementById("visitantes"); // aqui adicionamos um nova linha ao conteúdo existente visitantes.innerHTML += "<br>" + nome.value + " esteve aqui."; // limpando a caixa de texto nome.value = ""; } </script> </body></html> |
Esse exemplo muito simples apenas pega o valor digitado pelo usuário e exibe ele na página (ou seja, o conteúdo da página foi atualizado, sem ser necessário recarregar a página :D). Repare que na tag <form> definimos que no evento onsubmit a nossa função deveria ser executada e deveria ser retornado falso. Esse return false no final faz uma parte importante da mágica: evita que a página seja atualizada.
Nesse exemplo usamos a entrada do usuário para atualizar a página, mas é possível também incluir dados externos! Mas isso é assunto para o próximo post.
Curso de Javascript (parte 1)
Hoje vamos começar uma série de posts sobre programação em Javascript. Vamos criar desde códigos simples até alguns códigos mais avançados, e ainda apresentar diversas ferramentas úteis para um desenvolvedor Web. Mas como é de costume em qualquer curso, vamos começar com a teoria.
Javascript é uma linguagem interpretada (isto é, não precisa ser compilada e gerar um arquivo binário para que possa ser testada) voltada para a Web. Embora existam aplicações no lado do servidor, seu uso é mais comum no lado cliente, ou seja, no navegador do usuário, pois permite a criação de uma página dinâmica. O Javascript pode ser utilizado desde códigos simples para validação de um formulário, por exemplo, até aplicações complexas desenvolvidas com centenas de milhares de linhas de código.
Vamos começar com o básico: como incluir Javascript em minha página HTML? (esse curso supõe que você tenha pelo menos um conhecimento básico de HTML)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <html> <head> <title>Curso de Javascript do Blog infognosis</title> <!-- podemos incluir um arquivo externo assim: --> <script src="javascript.js" type="text/javascript"></script> </head> <body> <!-- ou inserir o código no meio do arquivo assim: --> <script type="text/javascript"> alert("Curso de Javascript do Blog Infognosis!"); </script> </body></html> |
Pronto, você já tem seu código Javascript rodando. Mas sem fazer nada. Agora vamos ver alguma coisa um pouco mais útil, pegar o valor de um campo de texto digitado pelo usuário e exibi-lo:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | <html> <head> <title>Curso de Javascript do Blog Infognosis</title> </head> <body> <!-- Nosso código Javascript --> <script type="text/javascript"> function formSubmit() { var nome = document.getElementById("nome").value(); alert("Olá " + nome + "! Bem-vindo ao Blog Infognosis!"); } </script> <!-- vamos criar um formulário com um campo de texto e um botão --> <form id="formulario" onsubmit="formSubmit()"> <label for="nome">Digite seu nome: </label> <input type="text" id="nome" /> <input type="submit" id="submit" text="Enviar" /> </form> </body></html> |








