Ubuntu Para Iniciantes

ENTENTENDENDO E APRENDENDO O JQUERY - DESENVOLVIMENTO WEB


O Jquery é uma biblioteca criada em javascript para facilitar o desenvolvimento web. O Jquery ganhou popularidade por sua versatilidade, facilidade e usabilidade entre os desenvolvedores web.


Jquery biblioteca em javascript para manipular ou controlar páginas web
John Resing - Jquery

O criador do Jquery é o John Resing que adotou o seguinte lema para sua ferramenta, "Escreva menos, produza mais". E é justamente isso que este fantástico framework faz. Faça download do Jquery aqui.







Entendendo o Jquery


O jquery é uma ferramenta capaz de manipular elementos html. Aprendendo a manipular elementos html com Jquery
Jquery - Produzir mais
É preciso ter emente que o Jquery trabalha com elementos do navegador e consequentemente com o código HTML. Cada elemento HTML possui uma marcação, por si só, esta marcação já é um meio de se mapear o elemento. E é isso que o Jquery faz, basicamente, manipula os elementos HTML client-side. Enquanto o PHP é server-side o jquery está do lado do cliente, ou seja do usuário, sua manipulação é instantânea.


Exemplo para entender o Jquery




veja o seguinte elemento html abaixo:

<input type="text" name="caixa_texto" value="">

O código acima irá ser interpretado pelo navegador/browser como uma caixa de texto ou edição.

O Jquery pode manipular este elemento pelo(a):

input
- elemento html
type
- tipo
name
- nome
value
- valor
class
- nome da classe css
id
- identificação do css


Aprendendo a manipular os elementos com Jquery


<html>
<head>
   
    <script src="blog/jquery-1.10.2.js"></script>
   
    <script>
    <!-- invocando o Jquery -->
    $(document).ready(function(){
       
         //Descomente cada linha e comente a anterior para funcionar corretamente.
         
         //1 mapeando pelo input
         $("input").val("Mapeando por input"); //comente esta linha com "duas barras" e descomente um exemplo de cada vez.
       
         //2 mapeando pelo tipo
         //$("input[type=text]").val("Mapeando pelo tipo=texto");
       
         //3 mapeando pelo nome
         //$("input[name=caixa_texto3]").val("Mapeando pelo nome");
        
         //4 mapeando pelo valor
         //$("input[value='']").val('Mapelando pelo valor');
        
         //5 exemplo com classe
         $(".exemplo_com_classe").val('Exemplo com classe');
        
         //6 exemplo com id
         $("#exemplo_com_id").val('Exemplo com Id');
     
     
         /*
        
            o val() é uma função para imprimir em
            um elemento que há o atributo value,
            como caixas de textos.
           
        
         */
     
     
        })
   
    </script>

</head>
<body>

  <input type="text" name="caixa_texto1" value=""> <br>
  <input type="text" name="caixa_texto2" value=""> <br>
  <input type="text" name="caixa_texto3" value=""> <br>
  <input type="text" name="caixa_texto4" value=""> <br>  <br>
  Exemplo com classe <br>
  <input type="text" class="exemplo_com_classe" name="caixa_texto5" value=""> <br> <br>
  Exemplo com ID   <br>
  <input type="text" id="exemplo_com_id" name="caixa_texto6" value=""> <br>
 

</body>
</html>

 DEIXE SEU COMENTÁRIO E AJUDE A MELHORAR O CONTEÚDO DO BLOG 


ENTENTENDENDO E APRENDENDO O JQUERY - DESENVOLVIMENTO WEB Reviewed by Ubuntu para Iniciantes Marcelo Weihmayr on 18:14:00 Rating: 5

Nenhum comentário :

Olá, faça seu comentário com sugestões, dicas ou críticas

Powered By Blogger , Designed by Sweetheme

Formulário de contato

Nome

E-mail *

Mensagem *

Marcelo Weihmayr. Tecnologia do Blogger.