Baixe o app para aproveitar ainda mais
Leia os materiais offline, sem usar a internet. Além de vários outros recursos!
Programação Cliente em Sistemas Web
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Compartilhar
Prévia do material em texto
Programação Cliente em Sistemas web
Prof. Jorge Ferreira
Aula 4-CONCEITOS DE SISTEMAS PARA INTERNET
Programação cliente em sistemas web
Objetivos da disciplina
Ensinar programação que rodam do lado cliente.
Alguns tipos de trabalho que podemos fazer.
3
Conteúdo Programático desta aula
Document Object Model (DOM)
Clientes HTML consistentes para servidores Web
Armazenamento de estado no cliente
Configurações personalizáveis pelo cliente.
Programação cliente em sistemas web
4
O Modelo de Objeto de Documento (DOM)
É o meio que o programador tem para acessar todos os elementos de uma página WEB.
Dentro do navegador, a página Web inteira – parágrafos, formulários, tabelas, etc. – é representada por uma hierarquia de objetos.
Com o JavaScript, é possível criar, modificar e remover dinamicamente os elementos da página Web.
Programação cliente em sistemas web
5
Como modelar um documento?
O método getElementById retorna objetos chamado nós DOM.
Cada elemento em uma página XHTML é modelado no navegador Web por meio de um nó DOM, e todos os nós em um documento compõem a árvore DOM da página.
Os nós são relacionados uns com os outros por meio de relacionamentos denominados pai-e-filho.
Programação cliente em sistemas web
6
O DOM Inspetor e a Barra de ferramentas de desenvolvedor da Microsoft.
Ao instalar o Firefox, você pode optar por instalar uma ferramenta chamada DOM Inspector, que possibilita a visualização da árvore DOM de um documento XHTML e a Microsoft fornece uma Barra de ferramentas de desenvolvedor para Internet Explorer que possibilita inspecionar a árvore DOM.
Programação cliente em sistemas web
7
Programação cliente em sistemas web
8
Programação cliente em sistemas web
9
<title>Alterando Estilos Dinâmicamente</title>
<script type = “text/javascript">
<!--
function start(){
var inputColor = prompt("Enter com uma cor" + "Cor do fundo", “");
document.body.style.backgroundColor = inputColor;}
//-->
</script>
</head>
<body id= "body" onload = “start()">
<p>Bem vindo para nosso WebSite</p>
Programação cliente em sistemas web
10
Programação cliente em sistemas web
11
Programação cliente em sistemas web
12
Armazenamento de estado no cliente - Cookies
Os cookies oferecem aos desenvolvedores uma ferramenta para personalizar páginas web. Um cookie é um pedaço de dado que fica armazenado no computador do cliente para manter informações sobre ele durante e entre as sessões do navegador.
Limitações:
4k de tamanho
20 cookies por domínio
Programação cliente em sistemas web
13
<body>
<h2>Cookies</h2>
<form method = "post" action = “criaCookie.jsp">
Digite um login:
<input type = "text" name = “txtname"><br>
Digite uma senha:
<input type = "password" name = “txtsenha"><br>
<input type = "submit" value = "Enviar dados”>
</form>
</body>
Programação cliente em sistemas web
14
criaCookies
T<%@ page language = "java" import= "java.util.*" %>
<%
String username = request.getParameter(“txtname");
String password = request.getParameter(“txtsenha");
if(null == username) username = “";
if(null == password) password = "";
Programação cliente em sistemas web
15
Continuação
Cookie cookiename = new Cookie ("username", username);
Cookie cookiesenha = new Cookie ("password", password);
response.addCookie(cookiename);
response.addCookie(cookiesenha);
%>
Programação cliente em sistemas web
16
Mostra Cookie
<%@ page language = "java" %>
<%
Cookie cookies[] = request.getCookies();
if (null != cookies){
for (int i = 0; i < cookies.length; i++){
Cookie cookie = cookies[i];
out.println("name: "+cookie.getName()+ “<br>");
out.println("valor: "+cookie.getValue()+ “<br>”);}
}
else{
out.print("Não há cookies”);
}%>
Programação cliente em sistemas web
17
Sessões do Usuário
Foram criadas diversas técnicas para manter persistentes as informações de um cliente entre páginas web. Uma delas é conhecida como session track, ou uso de sessões, ou ainda chamada de personalização, e é sobre ela que trata esta parte, introduzindo o assunto de manutenção do estado do cliente.
Algumas linguagens utilizam objetos de sessão. Tais objetos também são chamados de pseudo-sessions ou simplesmente session e podem ser utilizados para armazenar informações entre requisições ao servidor.
Programação cliente em sistemas web
Jorge Ferreira da Silva
Professor Universitário, Empresário na área de Desenvolvimento de Sites e Sistemas pela Empresa Mk-Desenvolvimento de Software LTDA - Desde 2009. Com especialização concluída em Dezembro de 2010, na área de Análise, Projeto e Gerência de Sistemas pela Universidade Estácio de Sá, pós-graduação em Docência do Ensino Superior pela Universidade Cândido Mendes e pós graduação em docência do ensino médio e fundamental. Também possui graduação em Ciência da Computação pela Universidade Veiga de Almeida (2004) , graduação em Superior de Tecnologia em Informática pela Universidade Veiga de Almeida (2000).
http://lattes.cnpq.br/4587014427208613
Programação cliente em sistemas web
Obrigado! Até a próxima aula.
Continue navegando
Materiais relacionados
4 pág.
10 pág.
Perguntas relacionadas
Compartilhar