Programação WEB I DOM (Document Object Manager)
|
|
- João Lucas Bruno Caldas Lacerda
- 5 Há anos
- Visualizações:
Transcrição
1 Programação WEB I DOM (Document Object Manager)
2 DOM Significa Modelo de Objetos de Documentos e tem por finalidade descrever e padronizar os objetos e seus relacionamentos em uma aplicação. Tem a finalidade de auxiliar o desenvolvimento de aplicações de natureza geral. O DOM pode ser definido também como uma representação da estrutura HTML do documento. Essa representação é apresentada em forma de árvore.
3 DOM
4 Para ter acesso aos itens presentes no documento, estes itens devem ter sido carregados antes de serem chamados. Por isso é importante a utilização do seguinte código: <script type= text/javascript > window.onload = function () { // A função só é chamada ao carregar tudo do documento. function um() { alert( Um ); function dois(){ alert( Dois );
5 Propriedade alinkcolor bgcolor classes Form ids Image images array lastmodified Link links array location referrer title Descrição Cor dos links ativos Cor de fundo Acessar as classes CSS Formulário da página. Acessa pelo nome Ids do CSS Imagem da página. Acessa pelo nome Cada uma das imagens da página no array Data da última modificação Um link da página. Acessa pelo nome Um array com cada um dos links da página. A URL do documento que se está visualizando. A página de onde vem o usuário Título da página
6 document.title Altera ou retorna o Título do documento Document.title = Testando ; document.bgcolor Altera ou retorna a Cor de fundo do documento document.bgcolor= #000FF ;
7
8 document.getelementbyid() Acessa o elemento cujo ID foi definido e retorna uma referência ao elemento. window.onload = function(){ var teste = document.getelementbyid( tipo ); <body> <h2 id= tipo >Tipos de Acesso ao DOM</h2>
9 element.style A propriedade style permite que sejam definidas regras de estilo a serem aplicadas nos elementos. Sintaxe: Elemento.style.propriedade = valor da propriedade ; Na sintaxe Javascript as propriedades css compostas por duas palavras separadas por hífen devem ser escritas em camelcase. background-color = backgroundcolor Z-index = zindex text-ident = textident border-top-width = bordertopwidth padding-left = paddingleft
10 window.onload = function(){ var teste = document.getelementbyid( tipo ); teste.style.backgroundcolor = #00FF00 ; teste.style.border= 2px solid #0000FF ; <body> <h2 id= tipo >Tipos de Acesso ao DOM</h2>
11 document.getelementsbytagname() Acessa todos os elementos do DOM do tipo definido no parâmetro tag e retorna um array cujos itens fazem referência aos elementos desse tipo, na ordem em que aparecem na marcação. window.onload = function(){ var teste = document.getelementsbytagname( h2 ); <body> <h2 id= tipo >Tipos de Acesso ao DOM</h2> <h2>teste 2</h2> <h2>teste 3</h2>
12 window.onload = function(){ var teste = document.getelementsbytagname( h2 ); teste[0].style.backgroundcolor = red ; teste[1].style.backgroundcolor= green ; <body> <h2 id= tipo >Tipos de Acesso ao DOM</h2> <h2>teste 2</h2> <h2>teste 3</h2>
13 document.getelementsbyname() Acessa todos os elementos cujo atributo name tenha sido definido no parâmetro window.onload = function(){ var teste = document.getelementsbyname( teste ); <body> <input name= teste /> <a name= teste />
14 document.getelementsbyname() Acessa todos os elementos cujo atributo name tenha sido definido no parâmetro window.onload = function(){ var teste = document.getelementsname( teste ); teste[0].style.backgroundcolor = red ; <body> <input name= teste /> <a name= teste />
15 innerhtml Permite que se inspecione ou se defina o conteúdo HTML de um elemento do DOM. window.onload = function(){ var mensg = document.getelementbyid( msg ); var parag = document.getelementsbytagname( p ); parag[0].innerhtml = Mudando o Parágrafo ; mensg.innerhtml= <h2>testando</h2> ; <body> <div id= mensg ></div> <p>texto!</p>
16 Links Document.links Retorna uma coleção com todos os links presentes no documento que tenham o atributo href. Document.links.length // Retorna a quantidade de links em uma página.
17 Links <html> <head> <script type="text/javascript"> function mudarendereco(){ var link = document.links[0]; link.href=" </script> </head> <body> <a id="x" href=" onclick="mudarendereco()"> Mudar endereço </a> </body> </html>
18 Document.forms Retorna uma coleção com todos os formulários presentes no documento. Document.forms.length // Retorna a quantidade de formulários em uma página.
19 Document.images Retorna uma coleção com todos os formulários presentes no documento. Document.images.length // Retorna a quantidade de imagens em uma página.
20 As Imagens são objetos por si só, portanto é possível criar novas instâncias de um image usando o construtor new. Var imagem = new image(); Imagem.src = imagem01.jpg ; Imagem.width = 350px ;
21 Construa um slideshow de imagens, em que se possa avançar e retornar imagens.
22 Eventos window.onload = function(){ var mensg = document.getelementbyid( msg ); var texto = document.getelementbyid( texto ); mensg.onclick = function(){ texto.innerhtml = Teste ; <body> <input type= button id= msg value= Clique Aqui /> <p id= texto >Texto!</p>
23 Recuperando Itens de um Formulário Como acessar um formulário: Nome (atributo NAME) Array de formulários <form name="formulario1"> <input type=text name=campo1> <input type=text name=campo2> </form> document.formulario1 document.forms[0]
24 Recuperando Itens de um Formulário Como acessar elementos do formulário: Nome (atributo NAME) Array de elementos <form name="formulario1"> <input type=text name=campo1> <input type=text name=campo2> </form> document.formulario1.campo1 document.formulario1.elements[0] document.formulario1.campo2 document.formulario1.elements[1] var variavel = document.formulario1.elemento1.value
25 Implemente o código de uma calculadora, porém agora utilizando o objeto documento e suas formas de acesso aos itens do documento. Siga a Interface mostrada abaixo e utilize funções para realizar as ações solicitadas.
26 Adicionando Linhas em uma Tabela window.onload = function(){ var tabela = document.getelementbyid("tabela"); var linha = tabela.insertrow(-1); //Insere uma linha como última. var col1 = linha.insertcell(0); //Insere uma Coluna var col2 = linha.insertcell(1); //Insere outra Coluna col1.innerhtml = "Valor 1"; col2.innerhtml = "Valor 2";
27 Excluindo Linhas em uma Tabela document.getelementbyid( tabela").deleterow(0); 0 pode ser substituído pelo número da linha que se quer deletar.
28 Implemente o código que recebe dois valores vindos de campos de um formulário e acrescentem esse valor em uma tabela.
29 createelement Cria um elemento appendchild Acresce um filho a um elemento //1º - Referencia o elemento onde deseja-se criar var conteudo = document.getelementbyid("box"); // 2º - Define nova tag a ser criada var newelement = document.createelement( h1 ); // 3º - Cria o elemento texto newelement.appendchild(document.createtextnode( Elemento criado")); // 4º - Inclui novo elemento conteudo.appendchild(newelement);
30 insertbefore appendchild insere o objeto sempre como o último filho (child) de um elemeto pai (parent) insertbefore insere um elemento em um local específico // 1º var newelement = document.createelement(what); // 2º newelement.appendchild(document.createtextnode("título do parágrafo")); // 3º var referencia = document.getelementbyid("paragrafo"); // 4º var parenttag = referencia.parentnode; // 5º parenttag.insertbefore(newelement, referencia);
31 setattribute Declara ou altera Atributos de elementos var input = document.createelement('input'); input.setattribute('type', 'text'); input.setattribute('name', Teste ); input.setattribute('id', 'new_input ); input.setattribute('value', '');
32 Criando Elementos function criar(){ //onde o elemento será adicionado pai = document.getelementbyid("corpo"); //definimos qual elemento queremos criar elem = document.createelement("h1"); //Definimos o texto do elemento. txt = document.createtextnode("texto criado dinamicamente "+pai.childnodes.length); //adicionamos o texto no elemento elem.appendchild(txt); //adicionamos o elemento com o texto na div corpo pai.appendchild(elem);
33 Excluindo Elementos function deletar(){ //se não existir elementos h1 ele não faz nada. if (pai.childnodes.length!= 0){ //de onde o elemento será deletado pai = document.getelementbyid("corpo"); //como o elemento h1 é filho do elemento corpo usamos o childnodes[x] //para deletarmos. elem = pai.childnodes[pai.childnodes.length-1]; //remove o elemento //elem.removenode(true); pai.removechild(elem)
34 Inserindo Elementos em um Select function adicionar() { var x=document.getelementbyid("myselect"); var option=document.createelement("option"); option.text="kiwi"; try { // Tenta executar para o Internet Explorer x.add(option,x.options[null]); catch (e) { x.add(option,null);
35 Excluindo Elementos de um Select function removeoption() { var x=document.getelementbyid("myselect"); x.remove(x.selectedindex);
Programação WEB I DOM (Document Object Manager)
Programação WEB I DOM (Document Object Manager) DOM Significa Modelo de Objetos de Documentos e tem por finalidade descrever e padronizar os objetos e seus relacionamentos em uma aplicação. Tem a finalidade
Leia maisPROGRAMAÇÃO PARA INTERNET RICA DHTML E O DOCUMENT OBJECT MODEL
PROGRAMAÇÃO PARA INTERNET RICA DHTML E O DOCUMENT OBJECT MODEL Prof. Dr. Daniel Caetano 2011-2 Visão Geral 1 2 3 4 DHTML Document Object Model Manipulando o DOM Manipulando o CSS pelo DOM Material de Estudo
Leia maisAula 21 DOM. Desenvolvimento Web I Prof. Filipe Arantes Fernandes
Aula 21 DOM Desenvolvimento Web I Prof. Filipe Arantes Fernandes filipe.arantes@ifsudestemg.edu.br Introdução DOM significa Modelo de Objetos de Documentos e tem por finalidade descrever e padronizar os
Leia maisPROGRAMAÇÃO PARA INTERNET RICA DHTML E O DOCUMENT OBJECT MODEL
PROGRAMAÇÃO PARA INTERNET RICA DHTML E O DOCUMENT OBJECT MODEL Prof. Dr. Daniel Caetano 2012-2 Objetivos Apresentar os conceitos do DHTML Conceituar a estruturação dos objetos do DOM Compreender as diferentes
Leia maisPROGRAMAÇÃO PARA INTERNET RICA DHTML E O DOCUMENT OBJECT MODEL
PROGRAMAÇÃO PARA INTERNET RICA DHTML E O DOCUMENT OBJECT MODEL Prof. Dr. Daniel Caetano 2013-1 Objetivos Apresentar os conceitos do DHTML Conceituar a estruturação dos objetos do DOM Compreender as diferentes
Leia maisPROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO JQUERY
PROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO JQUERY Prof. Dr. Daniel Caetano 2013-1 Objetivos Introduzir o framework jquery Capacitar para a construção de documentos jquery simples Compreender os mecanismos
Leia maisIntrodução ao Javascript. Parte 3 Prof. Victor Hugo Lopes
Introdução ao Javascript Parte 3 Prof. Victor Hugo Lopes agenda Trabalhando com Eventos DOM na prática: trabalhando com propriedades http://goo.gl/tkjhmb Eventos Evento é um acontecimento que ocorre a
Leia maisConstrução de Sites Aula 6
Construção de Sites Aula 6 Programa Instrutor Universidade Federal do Paraná Pró-reitoria de Assuntos Estudantis Departamento de Informática 17 de Agosto de 2010 Indice 1 Eventos onload e onunload 2 3
Leia maisPROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO JQUERY
PROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO JQUERY Prof. Dr. Daniel Caetano 2012-1 Objetivos Introduzir o framework JQuery Capacitar para a construção de documentos JQuery simples Compreender os mecanismos
Leia maisHTML BÁSICO E TEMPLATE VIEW. Gabrielle Amorim Porto
HTML BÁSICO E TEMPLATE VIEW Gabrielle Amorim Porto HTML BÁSICO E TEMPLATE VIEW Hypertext Markup Language Linguagem de marcação de hipertexto; Descreve a estrutura das páginas Web utilizando tags. HTML
Leia maisTecnologias para Web Design
Tecnologias para Javascript e DOM Introdução à Scripts Um script do lado cliente é um programa que acompanha um documento HTML Pode estar incluído no próprio documento embutido ou acompanha-lo num arquivo
Leia maisCSS Cascading Style Sheets
CSS Cascading Style Sheets Linguagem de Folhas de Estilo Introdução Faz parte da versão 4 do html Utilizado para padronizar os componentes html Pode ser utilizado de três formas: Inline quando é utilizada
Leia maisAplicativos móveis com HTML5
Aplicativos móveis com HTML5 Preparando o ambiente de desenvolvimento O código HTML pode ser escrito em qualquer editor de texto comum. Você pode utilizar o editor padrão do seu sistema operacional (Bloco
Leia maisJAVASCRIPT. Desenvolvimento Web I
JAVASCRIPT Desenvolvimento Web I JavaScript HTML Conteúdo - ( Markup language) CSS Apresentação (Style Sheet language) JavaScript (Programming language) Uso de JavaScript : Validação de formulários, galerias
Leia maisJava: Linguagem de programação (OOP) JavaScipt: Linguagem de scripts (OOP)
Executado do lado do cliente, interage com o usuário sem a necessidade do script passar pelo servidor. Desenvolvida por Brendan Eich, da Netscape Communications Corporation em 1995 (LiveScript). 1ª linguagem
Leia maisDesenvolvimento Web. JavaScript aula IV Acesso a documentos com Document Object Model (DOM) Professor: Bruno E. G. Gomes
INSTITUTO FEDERAL DE EDUCAÇÃO CIÊNCIA E TECNOLOGIA CURSO TÉCNICO INTEGRADO EM INFORMÁTICA CAMPUS CURRAIS NOVOS Desenvolvimento Web JavaScript aula IV Acesso a documentos com Document Object Model (DOM)
Leia maisDesenvolvimento de Aplicações para Internet
Desenvolvimento de Aplicações para Internet CSS Celso Olivete Júnior olivete@fct.unesp.br HTML Formatando o documento... Formulário Responsável por fazer a interação entre os dados fornecidos pelo usuário
Leia maisPROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO JAVASCRIPT
PROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO JAVASCRIPT Prof. Dr. Daniel Caetano 2012-1 Objetivos Apresentar a natureza da linguagem JavaScript Apresentar o JavaScript com ferramenta de manipulação de
Leia maisO que faz um servidor/navegador web? 14/03/2016 Rômulo da Silva Lima Slid e 2
HTML O que faz um servidor/navegador web? e 2 O que é? HyperText Markup Language Utilizada para produzir páginas WEB Documentos escritos na linguagem HTML podem ser traduzidos por browser O HTML utiliza
Leia maisHTML / JAVASCRIPT. A versão atual é o HTML5 (seus predecessores imediatos são HTML 4.01, XHTML 1.1, etc.).
HTML / JAVASCRIPT Estamos iniciando o estudo do HTML através das TAGS (comandos) para construir formulários. Isso facilitará a continuidade dos nossos estudos da linguagem de programação JavaScript, a
Leia mais<link rel="stylesheet" type="text/css" href="imagens.css" />
Este código é responsável pela visualização html. exibição de Imagens
Leia mais17/01/2016 PROGRAMAÇÃO EM AMBIENTE WEB I UM POUCO DE HISTÓRIA WWW. Tudo começou com a ARPANET; 1977 ARPANET nasce
PROGRAMAÇÃO EM AMBIENTE WEB I Prof. Esp. Fabiano Taguchi fabianotaguchi@gmail.com http://fabianotaguchi.wordpress.com UM POUCO DE HISTÓRIA Tudo começou com a ARPANET; 1977 ARPANET nasce 1987 Das universidades,
Leia maisPROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO JAVASCRIPT
PROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO JAVASCRIPT Prof. Dr. Daniel Caetano 2011-2 Visão Geral 1 2 3 4 5 6 7 8 JavaScript: Ling. Interpretada Client Side x Server Side Integrando o JavaScript Eventos
Leia maisProgramação Cliente em. jquery. Fontes: Wendell S. Soares e vinteum.com
Programação Cliente em Sistemas Web jquery Fontes: Wendell S. Soares e vinteum.com Apresentação jquery é uma biblioteca JavaScript criada por John Resig e disponibilizada como software livre e aberto O
Leia maisControle de tipos; classes; formulários; eventos; validações.
Disciplina: Autoria Web AULA 14 Controle de tipos; classes; formulários; eventos; validações. Adaptado do professor Bruno Gomes, IFRN Edmilson Campos, Prof. MsC. http://edmilsoncampos.net edmilson.campos@ifrn.edu.br
Leia maisHTML 5 LINGUAGEM DE MARCAÇÃO E ESTILO - CSS - Prof. Rosemary Melo
HTML 5 LINGUAGEM DE MARCAÇÃO E ESTILO - CSS - Prof. Rosemary Melo RESUMO Linguagem de Marcação e Estilo - CSS DESCRIÇÃO Regra CSS Vinculação Inline Vinculação Incorporada Vinculação Externa TAGS seletor
Leia maisTECNOLOGIAS WEB. Unidade 3 Linguagem de Marcação e Estilo. Luiz Leão
Luiz Leão luizleao@gmail.com http://luizleao.com Conteúdo da Unidade Cascading Style Sheet (CSS) Linguagem CSS Introdução É uma linguagem de folhas de estilo utilizada para definir a apresentação de documentos
Leia maisCOM222 DESENVOLVIMENTO DE SISTEMAS WEB. Aula 01: HTML e CSS
COM222 DESENVOLVIMENTO DE SISTEMAS WEB Aula 01: HTML e CSS 2 Conteúdo Noções introdutórias HTML CSS HTML: HyperText Markup Language 3 Linguagem usada para construir páginas Web Função principal Estruturar
Leia maisPROGRAMAÇÃO EM AMBIENTE WEB I
PROGRAMAÇÃO EM AMBIENTE WEB I Prof. Esp. Fabiano Taguchi fabianotaguchi@gmail.com http://fabianotaguchi.wordpress.com UM POUCO DE HISTÓRIA Tudo começou com a ARPANET; 1977 ARPANET nasce 1987 Das universidades,
Leia maisProgramação WEB I Funções
Programação WEB I Funções Funções As funções podem ser definidas como um conjunto de instruções, agrupadas para executar uma determinada tarefa. Dentro de uma função pode existir uma chamada a outra função.
Leia maisCSS é a abreviatura para Cascading Style Sheets Folhas de Estilo em Cascata
CSS CSS é a abreviatura para Cascading Style Sheets Folhas de Estilo em Cascata CSS é uma linguagem para estilos (formatação) que define o layout de documentos HTML. CSS controla fontes, cores, margens,
Leia maisFunções em JavaScript
Sintaxe para declaração de funções: function f1() { return "Olá"; function f2(nome) { return "Bom dia " + nome; Funções em JavaScript As funções podem retornar ou não valores e podem receber ou não argumentos.
Leia maisENGENHARIA DE USABILIDADE Unidade V Acessibilidade à Web. Luiz Leão
Luiz Leão luizleao@gmail.com http://www.luizleao.com Conteúdo Programático Conceitos e Importância Projeto e desenvolvimento de Web acessível Acessibilidade É o processo e as técnicas usadas para criar
Leia maisDesenvolvimento de Sistemas Web Prof. Leandro Roberto. Aula 18 JavaScript: Eventos MySQL PHP (insert, update e delete)
Desenvolvimento de Sistemas Web Prof. Leandro Roberto Aula 18 JavaScript: Eventos MySQL PHP (insert, update e delete) JavaScript Eventos Alguns eventos de uma página HTML podem ser interceptados e programados
Leia maisPROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO JAVASCRIPT
PROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO JAVASCRIPT Prof. Dr. Daniel Caetano 2012-2 Objetivos Apresentar a natureza da linguagem JavaScript Apresentar o JavaScript com ferramenta de manipulação de
Leia maisF E B A C. Exercício de Fixação 3. FACULDADE DE EDUCAÇÃO DE BACABAL FEBAC Credenciamento MEC/Portaria: 472/07 Resolução: 80/07
F E B A C FACULDADE DE EDUCAÇÃO DE BACABAL FACULDADE DE EDUCAÇÃO DE BACABAL FEBAC Credenciamento MEC/Portaria: 472/07 Resolução: 80/07 Curso: Sistemas para Internet Período: 2 o Disciplina: Fundamentos
Leia maisAplicações e Serviços de Internet
Aplicações e Serviços de Internet Scripting no Cliente JavaScript & DOM Controlo de Dados Conteúdo JavaScript DOM 2 2 Lado Cliente: Como chamar JavaScript?. Escrever sua função* e inseri-la na página HTML
Leia maisUma regra CSS quando válida para vários seletores, estes podem ser agrupados. Exemplo: h1, h2, h3, h4, h5, h6 { color: #00FF00; }
CENTRO PASTORAL, EDUCACIONAL E ASSISTENCIAL DOM CARLOS CPEA Reconhecido de Utilidade Pública pelo Decreto No. 5.692 de 08.11.1967 FACULDADE VIZINHANÇA VALE DO IGUAÇU VIZIVALI DOIS VIZINHOS PARANÁ Criada
Leia maisjquery Curso de Tecnologia em Análise e Desenvolvimento de Sistemas Desenvolvimento de Sistemas web
jquery Curso de Tecnologia em Análise e Desenvolvimento de Sistemas Desenvolvimento de Sistemas web Introdução jquery é uma biblioteca JavaScript que tem como objetivo principal facilitar a programação
Leia maisCascading Style Sheets
Cascading Style Sheets PROF. ME. HÉLIO ESPERIDIÃO CSS Cascading Style Sheets (CSS) é uma linguagem de folhas de estilo utilizada para definir a apresentação de documentos escritos em uma linguagem de marcação,
Leia maisJosé Janeiro (Nº2467) Trabalho prático: HTML, CSS, Javascript. EmpregoWeb-Registo de pessoas
José Janeiro (Nº2467) Trabalho prático: HTML, CSS, Javascript EmpregoWeb-Registo de pessoas Elabore um sítio Web de nome EmpregoWeb, recorrendo à linguagem HTML utilizando folhas de estilos (CCS) que registe
Leia maisConstrução de sites Aula 1
Construção de sites Aula 1 Programa Instrutor Universidade Federal do Paraná Pró-reitoria de Assuntos Estudantis Departamento de Informática 31 de Julho de 2010 Indice Estrutura da Internet 1 Estrutura
Leia maisSIMULADOS & TUTORIAIS
SIMULADOS & TUTORIAIS TUTORIAIS HTML Como utilizar cabeçalhos e elementos de cabeçalhos de página em HTML Copyright 2013 Todos os Direitos Reservados Jorge Eider F. da Silva Proibida a reprodução deste
Leia maisWeb Design Aula 15: Conhecendo CSS
Web Design Aula 15: Conhecendo CSS Professora: Priscilla Suene priscilla.silverio@ifrn.edu.br Roteiro Agrupando Seletores Herança Comentários Exercício Adicionando Classes Validação Propriedades Agrupando
Leia maisFolha Prática Nº5 CSS. UNIVERSIDADE DA BEIRA INTERIOR Faculdade de Engenharia Departamento de Informática. Tecnologias Internet - 2011/2012
Folha Prática Nº CSS / Filipe Quinaz . Folhas de Estilo 0 Internas, delimitadas pela marca style h, h font-family: sans-serif; color: #CC;
Leia maisAula 22 Eventos. Desenvolvimento Web I Prof. Filipe Arantes Fernandes
Aula 22 Eventos Desenvolvimento Web I Prof. Filipe Arantes Fernandes filipe.arantes@ifsudestemg.edu.br Introdução São os eventos que tornam a linguagem JS útil; Sem os eventos, as ações não seriam disparadas
Leia maisINTRODUÇÃO AO DESENVOLVIMENTO FRONT-END COM HTML, CSS E JAVASCRIPT
v1.1 INTRODUÇÃO AO DESENVOLVIMENTO FRONT-END COM HTML, CSS E JAVASCRIPT AULA 7 CRIANDO INTERAÇÕES COM JAVASCRIPT (PARTE 2) Eder Franco @ FPF Tech The road so far... JavaScript Desenvolvida para criar interações
Leia maisPROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO CSS PARTE I
PROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO CSS PARTE I Prof. Dr. Daniel Caetano 2012-1 Objetivos Apresentar o CSS como substituto dos parâmetros visuais do HTML Capacitar para a construção de documentos
Leia maisDisciplina: Desenvolvimento Web Professor: Paulo César Fernandes de Oliveira, BSc, PhD
1. O que é CSS? a) É a linguagem que se usa para se definir quais serão os elementos de uma página HTML. b) É uma linguagem que se usa para se modificar o estilo de apresentação dos elementos de uma página
Leia maiscss Cascading Style Sheets CSS CASCADING STYLE SHEETS
css Cascading Style Sheets CSS CASCADING STYLE SHEETS Oque é o CSS Cascading Style Sheets - Folhas de Estilo em Cascata Não é uma linguagem de programação, é uma linguagem de estilo. Define a apresentação
Leia maisQUEM FEZ O TRABALHO?
Introdução a Linguagem HTML: Conceitos Básicos e Estrutura ANA PAULAALVES DE LIMA 1 QUEM FEZ O TRABALHO? Com as tagsaprendidas hoje, faça uma página HTML sobre você com as seguintes informações: Seu nome
Leia maisAULA 02 Introdução (HTML, CSS e Javascript) PROGRAMAÇÃO PARA WEB Marcelo Henrique dos Santos
AULA 02 Introdução (HTML, CSS e Javascript) Mestrado em Educação (em andamento) MBA em Negócios em Mídias Digitais MBA em Marketing e Vendas Especialista em games : Produção e Programação Bacharel em Sistema
Leia maisAutoria Web. Iniciação à JavaScript. Msc. Eliezio Soares
Autoria Web Iniciação à JavaScript Msc. Eliezio Soares eliezio.soares@ifrn.edu.br http://docente.ifrn.edu.br/elieziosoares O que É JavaScript? Javascript é a linguagem de programação de HTML e da web;
Leia maisPROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO CSS PARTE II
PROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO CSS PARTE II Prof. Dr. Daniel Caetano 2012-1 Objetivos Apresentar o CSS como ferramenta de layout de página Capacitar para o posicionamento de elementos com
Leia maisConteúdo. DHTML tópicos Hamilton Lima - 2002-2004
DHTML tópicos Hamilton Lima - 2002-2004 Conteúdo 1. meu primeiro script... 2 2. DOM Document Object Model...2 3. tipo de execução de scripts...2 4. resposta a um evento... 3 5. tipos de dados, variaveis
Leia maisRespostas - RESUMO: Questionário CSS. 1) O padrão CSS nasceu para tentar minimizar quais problemas ligados à gestão de conteúdos na web?
Faculdade de Informática de Taquara Disciplina: Autoria e Design na Internet I Profa. Flavia Pereira de Carvalho Respostas - RESUMO: Questionário CSS 1) O padrão CSS nasceu para tentar minimizar quais
Leia mais<head>/*o elemento <head> deve incluir um título para o documento, e pode incluir scripts, estilos, informações de meta, e muito mais*/
/*o declaração deve ser a primeira coisa em seu documento HTML, antes da tag . A declaração não é uma tag HTML; é uma instrução para o navegador da web sobre qual
Leia maisfoi desenvolvida... para criar animações, manipular eventos e desenvolver aplicações AJAX
foi desenvolvida... para criar animações, manipular eventos e desenvolver aplicações AJAX é uma biblioteca Java Script crossbrowser desenvolvida para simplificar os scripts que interagem com a linguagem
Leia maisRecursos Complementares (Tabelas e Formulários)
Linguagem de Programação para Web Recursos Complementares (Tabelas e Formulários) Prof. Mauro Lopes 1-31 30 Objetivo Nesta aula iremos trabalhar o conceito de tabelas e todas as tags associadas ao seu
Leia maisAJAX. Prof. Marcos Alexandruk
Prof. Marcos Alexandruk m.alexandruk@hotmail.com Asynchronous JavaScript and XML Não é uma "nova tecnologia" Utiliza os recursos já existentes do JavaScript Jesse James Garret utilizou o termo pela primeira
Leia maisDesenvolvimento Web CSS Conceitos básicos parte II
Desenvolvimento Web CSS Conceitos básicos parte II Prof.: Bruno E. G. Gomes 2014 Folhas de Estilo Externa Estilos são definidos em um arquivo separado e incorporados à página através da tag link Podem
Leia mais08/11/2012. Tecnologias WEB - CSS. Professor Elisson Lobão
Tecnologias WEB - CSS Professor Elisson Lobão 1 CSS CSS(Cascade Style Sheets) são folhas de estilo que permitem controlar a aparência dos elementos HTML Vantagens: Grande liberdade de formatação Maior
Leia maisMini-curso de PHP. Aulas ministradas por: André Luis de Paula Arthur Kalsing Diego Silva
Mini-curso de PHP Aulas ministradas por: André Luis de Paula Arthur Kalsing Diego Silva Aula 1 Breve introdução de HTML, Conceitos básicos de PHP, Sintaxe, Separador de instruções e Comentários (Cap 1
Leia maisAula 4 Modelo CSS. Efeito cascata. Ordem em cascata. Declarações normais e importantes. Exemplo. Especificidade de um seletor 30/08/2013
Efeito cascata Aula 4 Modelo CSS Curso: Técnico em Informática / 2º módulo Disciplina: Desenvolvimento Web Professora: Luciana Balieiro Cosme Fontes das folhas de estilo Autor Usuário Agente do usuário
Leia maisConstruindo um sistema simples de cadastro de fornecedores em PHP e MySQL.
Construindo um sistema simples de cadastro de fornecedores em PHP e MySQL. Procuraremos mostrar os principais procedimentos para fazer um cadastro de registros numa base de dados MySQL utilizando a linguagem
Leia maisAula 5 Cabeçalhos, Imagens e Links
Roteiro Aula 5 Cabeçalhos, Imagens e Links Efeitos em cabeçalhos Imagens e CSS Links Curso: Técnico em Informática / 2º Módulo Disciplina: Desenvolvimento Web Professora: Luciana Balieiro Cosme Efeitos
Leia maisWeb Design. Prof. Felippe
Web Design Prof. Felippe 2015 Sobre a disciplina Fornecer ao aluno subsídios para o projeto e desenvolvimento de interfaces de sistemas Web eficientes, amigáveis e intuitivas. Conceitos fundamentais sobre
Leia maisAté agora aprendemos formas para nomear e processar dados em Javascript.
Manipular HTML Recapitulando Até agora aprendemos formas para nomear e processar dados em Javascript. Os tipos de dados primários de que falámos (String, Number e Boolean) são exactamente isso - pequenas
Leia maisEMENTA: PHOTOSHOP PARA WEB
WEB DESIGN 80h PRÉ-REQUISITOS: Informática Fundamental. OBJETIVO: Capacitar o aluno a utilizar as principais ferramentas de design na área de web sites, fóruns, mídias sociais, sistemas para Internet,
Leia maisSEPARAÇÃO EM: Apresentação Estrutura Comportamento
SEPARAÇÃO EM: Apresentação Estrutura Comportamento Arquitectura de Sistemas DEI-ISEP Estrutura/Apresentação/Comportamento Uma boa prática na construção de páginas web: Separação em 3 camadas: Estrutura
Leia maisA diferença entre um site que implementa CSS e outro que não o usa é gigantesca e notável.
Aula 02 - Introdução ao css ( folhas de estilo ) CSS é a sigla para o termo em inglês Cascading Style Sheets que, traduzido para o português, significa Folha de Estilo em Cascatas. O CSS é fácil de aprender
Leia maisIntrodução à Informática Escola Superior de Tecnologia - Ano Lectivo 2005/06 Prof. Bruno Silva
Introdução à Informática Escola Superior de Tecnologia - Ano Lectivo 2005/06 Prof. Bruno Silva Cascading Style Sheets - (CSS] Introdução Uma Style Sheet é um ficheiro que contém regras que dizem ao browser
Leia maisHTML 5 TAGS BÁSICAS E ESTRUTURAIS. Prof. Rosemary Melo
HTML 5 TAGS BÁSICAS E ESTRUTURAIS Prof. Rosemary Melo TAGS BÁSICAS DA LINGUAGEM TAG Indica que está criando uma página html TAG Área contém informação sobre a página TAG especifica
Leia maisJAVASCRIPT Laboratórios de Informática João Paulo Barraca, André Zúquete, Diogo Gomes
http://cseweb.ucsd.edu/~lerner/js.jpg JAVASCRIPT Laboratórios de Informática 2014-2015 João Paulo Barraca, André Zúquete, Diogo Gomes HTML, CSS, Javascript HTML define estrutura CSS define estilo Javascript
Leia mais<HTML> Vinícius Roggério da Rocha
Vinícius Roggério da Rocha www.monolitonimbus.com.br O que é HTML? HTML = HyperText Markup Language ou Linguagem de Marcação de Hipertexto Linguagem: maneira de se comunicar (entre máquinas, pessoas
Leia maisIntrodução à linguagem HTML. Volnys Borges Bernal
1 Introdução à linguagem HTML Volnys Borges Bernal 2013-2015 Volnys Bernal 2 Introdução à linguagem HTML Sumário Visão geral Primeira página Principais tags Principais atributos Formulários 2011-2015 Volnys
Leia maisJavaScript. JavaScript é uma linguagem de script usada em navegadores web. É uma linguagem dinâmica, estruturada e orientada em objetos.
JavaScript JavaScript é uma linguagem de script usada em navegadores web. É uma linguagem dinâmica, estruturada e orientada em objetos. Pode ser usada dentro do próprio arquivo HTML ou estruturada em um
Leia maisIntrodução à linguagem JavaScript
MIEEC SIEM ano letivo 2014/15 Introdução à linguagem JavaScript José A. Faria (jfaria@fe.up.pt) FEUP, DEGI Setembro 2014 Introdução ao JavaScript O JavaScript é uma linguagem utilizada sobretudo em client
Leia maisPROF. DANIELA PIRES. Aplicações para Web. Aplicações para Web - FMU - 2012 - Prof. Daniela Pires
PROF. DANIELA PIRES Aplicações para Web 1 *Oficialmente: *Uma biblioteca escrita em Javascript *Uma definição melhor: *jquery é uma Biblioteca JavaScript que simplifica a manipulação de um documento HTML
Leia maisOFICINA DA PESQUISA PROGRAMAÇÃO APLICADA À CIÊNCIA DA COMPUTAÇÃO
OFICINA DA PESQUISA PROGRAMAÇÃO APLICADA À CIÊNCIA DA COMPUTAÇÃO Prof. Msc. Carlos José Giudice dos Santos carlos@oficinadapesquisa.com.br www.oficinadapesquisa.com.br Linguagens de Programação Material
Leia maisRoteiro de Estudos e Atividades Avaliativas HTML
Roteiro de Estudos e Atividades Avaliativas HTML Faça essa atividade de forma individual ou em dupla, faça o máximo de questões que conseguir. Pesquise na Web o significado das tags e utilize-as para alcançar
Leia maisCriação de estilos CSS
Em primeiro lugar vamos inserir um parágrafo Marco Soares 1 Criação de estilos CSS Para começar, crie um site novo e uma página inicial para testes chamada index.html Vamos começar por criar alguns estilos
Leia maisTags estruturais <!-- --> Cria um comentário <html> </html> Envolve todo um documento html <head> </head> Envolve o cabeçalho de um documento html
Tags estruturais Cria um comentário Envolve todo um documento html Envolve o cabeçalho de um documento html Fornece informações gerais sobre o documento
Leia maisEste exercício será parecido com a montagem de um projeto real, onde trabalhamos com vários arquivos XHTML e um único arquivo CSS.
Este exercício será parecido com a montagem de um projeto real, onde trabalhamos com vários arquivos XHTML e um único arquivo CSS. 1) Crie uma pasta chamada com_estilo e salve dentro dela os arquivos obrigado.html
Leia maisIntrodução a Web Standards. Reinaldo Ferraz e Clécio Bachini
Introdução a Web Standards Reinaldo Ferraz e Clécio Bachini Document Object Model (DOM) Modelo de Documentos em Objetos Objetos em um Documento Markup Linguagem de Marcação Semântica Objetos com Sentido
Leia maisMODELO DE CAIXA (BOX MODEL)
Programação Web MODELO DE CAIXA (BOX MODEL) Conferencia 5 MSc. Yoenis Pantoja Zaldívar MODELO DE CAIXA (BOX MODEL) ( ) comportamento de CSS que provoca que todos os elementos incluidos numa página HTML
Leia maisINTRODUÇÃO AO DESENVOLVIMENTO WEB. PROFª. M.Sc. JULIANA H Q BENACCHIO
INTRODUÇÃO AO DESENVOLVIMENTO WEB PROFª. M.Sc. JULIANA H Q BENACCHIO A partir do HTML 4.01, o único modo de alterar a letra (cor, tamanho, tipo, etc.) ou o fundo (cor ou imagem) é utilizando o atributo
Leia maisInterfaces Pessoa. Laboratório 1. Máquina. HTML, CSS, JS- Introdução
Interfaces Pessoa Máquina Laboratório 1 HTML, CSS, JS- Introdução 01 HTML + CSS + JavaScript Tecnologia para desenvolvimento web: Páginas web Aplicações web Aplicações mobile HTML Linguagem standard para
Leia maisPROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO CSS PARTE I
PROGRAMAÇÃO PARA INTERNET RICA FUNDAMENTOS DO CSS PARTE I Prof. Dr. Daniel Caetano 2012-2 Objetivos Apresentar o CSS como substituto dos parâmetros visuais do HTML Apresentar a tag DIV Capacitar para a
Leia maisUniversidade Federal do Espírito Santo Centro de Ciências Agrárias CCA UFES Departamento de Computação. jquery
Universidade Federal do Espírito Santo Centro de Ciências Agrárias CCA UFES Departamento de Computação jquery Desenvolvimento de Sistemas para WEB Site: http://jeiks.net E-mail: jacsonrcsilva@gmail.com
Leia mais1.1 Cascading Style Sheets CSS
1.1 Cascading Style Sheets CSS Uma folha de estilos consiste de uma ou mais definições de estilo (tamanho de fonte, estilo da fonte, alinhamento de texto, cor de texto e do fundo, margens, altura da linha,
Leia maisHTML & CSS. uma introdução
HTML & CSS uma introdução HTML hypertext markup language CSS cascading style sheet linguagem de marcação que dá ao conteúdo estrutura e significado linguagem de estilo que dá ao conteúdo estilo e aparência
Leia maisFinalidade dos formulários
ENTENDENDO O FORMULÁRIO Na opinião de muitos a criação de formulários na linguagem HTML é uma das áreas mais importantes no desenvolvimento web. Diferentemente de outras marcações HTML o formulário não
Leia mais