Controle de tipos; classes; formulários; eventos; validações.

Transcrição

1 Disciplina: Autoria Web AULA 14 Controle de tipos; classes; formulários; eventos; validações. Adaptado do professor Bruno Gomes, IFRN Edmilson Campos, Prof. MsC.

2 typeof variavel document.write("o tipo de variavel é: " + typeof variavel)

3

4 » minhadata = new Date()» minhadata = new Date(ano,mês,dia,hora,minutos,segundos) minhadata = new Date(ano,mês,dia)

5 Método getdate() Retorna o dia e o mês (1-31) getday() Retorna o dia da semana (0-6) Descrição getfullyear() Retorna o ano com todos os dígitos gethours() Retorna a hora (0-23) getseconds() Retorna os segundos da data (0-59)»

6 dataatual = new Date() document.write(dataatual) datapassada = new Date(2010,12,6) document.write(datapassada) document.write("ano: "+dataatual.getfullyear()) document.write("ano: "+datapassada.getfullyear()) dataatual.setfullyear(2000) dia = dataatual.getdate() mes = parseint(dataatual.getmonth()) + 1 ano = dataatual.getfullyear() document.write (dia + "/" + mes + "/" + ano)

7 Método abs(x) acos(x) asin(x) atan(x) exp(x) cos(x) max(x,y) min(x,y) pow(x,y) sin(x) sqrt(x) tan(x) Descrição Retorna o valor absoluto de um número Retorna o arco co-seno de um número em radianos Retorna o arco seno de um número em radianos Retorna a arco tangente de x como um valor numerico entre -PI/2 e PI/2 radianos Retorna o expoente de e x Retorna o cosseno de um número Retorna o número com o maior valor de x e y Retorna o número com o menor valor de x e y Retorna o valor de x elevado a portência de y Retorna o seno de um número Retorna a raiz quadrada de x Retorna a tangente de um ângulo

8 document.write(math.max(2,7)); document.write(math.pow(4,2)); document.write(math.sqrt(36));

9 Fonte:

10 »»

11 Propriedade closed defaultstatus document history length location outerheight outerwidth scrollbars status statusbar Descrição Retorna se uma janela foi fechada ou não Muda ou retorna o texto padrão na barra de status da janela Retorna o Objeto do Documento Ver historia do objeto Muda ou retorna o número de frames do window Ver a localização do objeto Muda ou retorna a altura exterior da janela Muda ou retorna a largura externa da janela Mudar se a barra de rolagem deve ser visível Muda o texto da barra de status da janela Muda se a barra de status deve ser visível ou não

12 <form> <input type="button" value="clique-me!" onclick="window.status='olá Mundo!'"> </form>

13 Method alert() blur() close() confirm() createpopup() focus() moveby() moveto() prompt() resizeto() Description Mostra uma caixa de alerta com uma mensagem e um botão de OK Remove o foco da janela atual Fecha a janela atual Mostra uma caixa de diálogo com uma mensagem e um botão de OK e Cancelar Cria uma janela pop-up Sets focus to the current window Move uma janela em relação a sua posição atual Move uma janela para uma posição especificada Mostra uma caixa de diálogo que solicita uma entrada do usuário Redimensiona uma janela para uma altura e largua especificada Lista Completa:

14

15 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

16 document.bgcolor = red; document.title = "Novo Título"

17 Métodos getelementsbyname() getselection() close() open() write() writeln() Descrição Retorna a coleção de objetos com um nome específico Retorna um texto que está selecionado Fecha o fluxo do documento. Abre o fluxo do documento. Escreve na página HTML Escreve na página HTML, colocando uma quebra de linha ao final getelementbyid() Retorna o objeto pelo id

18 document.writeln("foi selecionado:\n" + document.getselection())

19 »» <form name="formulario1"> <input type=text name=campo1> <input type=text name=campo2> </form> document.formulario1 document.forms[0]

20 »» <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]

21 var variavel = document.formulario1.elemento1.value

22 action encoding id length method name target Propriedade Descrição Modifica ou retorna a ação de um atributo de um form Tipo de codificação do formulário Modifica ou retorna o id de um form Retorna o número de elementos de um form Modifica ou retorna o método HTTP Modifica ou retorna o name do form Modifica ou retorna onde abrir a ação de URL do formulário

23 document.formulário1.action = "pagina.php" document.formulário1.target = "janela_definida"

24 submit() reset() Método Submeter Descrição Reiniciar todo o formulário

25 <form name="formulario1" action="cadastro.php" method="post"> <input type="text" name="nome" value="" size="30"> <input type="button" value="enviar" onclick="validarformulario()"> </form> function validarformulario(){ if (document.formulario1.nome.value == ) alert( O formulário deve ser preenchido ) else document.meuformulário.submit() }

26 Propriedades accesskey defaultvalue disabled id maxlength name readonly size type value Descrição Modifica ou retorna a tecla de acesso a um campo de texto Modifica ou retorna o valor default do campo de texto Modifica ou retorna se o campo de texto está desativado ou não Modifica ou retorna o id de um campo de texto Modifica ou retorna o número máximo de caracteres no campo de texto Modifica ou retorna o nome do campo de texto Modifica ou retorna se o campo de texto é somente leitura ou não Modifica ou retorna o tamanho do campo de texto Retorna o tipo do elemento Modifica ou retorna o valor do atributo value do campo de texto

27 Método blur() focus() select() Descrição Remove o foco de um campo de texto do formulário Modifica o foco em um campo de texto Seleciona o conteúdo de um campo de texto

28 Propriedades accesskey alt checked defaultchecked disabled id name value Descrição Modifica ou retorna a tecla de acesso a um checkbox Modifica ou retorna um texto alternativo para ser exibido se o browser não suportar checkboxes Modifica ou retorna se um checkbox pode ser marcado Retorna o valor padrão do atributo checked Modifica ou retorna se um checkbox pode ser desativado Modifica ou retorna o id do checkbox Modifica ou retorna o name do checkbox Modifica ou retorna o valor do atributo value do checkbox

29 Método blur() click() focus() Descrição Remove o foco do checkbox Simula um click do mouse no checkbox Dá o foco para um checkbox

30 Propriedade accesskey alt checked defaultchecked disabled name value Descrição Sets or returns the keyboard key to access a radio button Sets or returns an alternate text to display if a browser does not support radio buttons Sets or returns the state of a radio button Returns the default state of a radio button Sets or returns whether or not a radio button should be disabled Sets or returns the name of a radio button Sets or returns the value of the value attribute of the radio button

31 Método blur() click() focus() Descrição Removes focus from a radio button Simulates a mouse-click on a radio button Sets focus on a radio button

32 Propriedade disabled form id length multiple name selectedindex size type Descrição Sets or returns whether or not a dropdown list should be disabled Returns a reference to the form that contains the dropdown list Sets or returns the id of a dropdown list Returns the number of options in a dropdown list Sets or returns whether or not multiple items can be selected Sets or returns the name of a dropdown list Sets or returns the index of the selected option in a dropdown list Sets or returns the number of visible rows in a dropdown list Returns the type of form element a dropdown list is

33 Método Descrição add() blur() focus() remove() Adds an option to a dropdown list Removes focus from a dropdown list Sets focus on a dropdown list Removes an option from a dropdown list

34 Propriedade accesskey cols defaultvalue disabled form id name readonly rows value Descrição Sets or returns the keyboard key to access a textarea Sets or returns the width of a textarea Sets or returns the default text in a textarea Sets or returns whether or not a textarea should be disabled Returns a reference to the form that contains the textarea Sets or returns the id of a textarea Sets or returns the name of a textarea Sets or returns whether or not a textarea should be read-only Sets or returns the height of a textarea Sets or returns the text in a textarea

35 Método blur() focus() select() Removes focus from a textarea Sets focus on a textarea Selects the text in a textarea Descrição

36 Atributo onabort onblur onchange onclick ondblclick onerror onfocus onkeydown onkeypress onkeyup onload O Evento ocorre quando: Loading of an image is interrupted An element loses focus The content of a field changes Mouse clicks an object Mouse double-clicks an object An error occurs when loading a document or an image An element gets focus A keyboard key is pressed A keyboard key is pressed or held down A keyboard key is released A page or an image is finished loading

37 Atributo onmousedown onmousemove onmouseout onmouseover onmouseup onreset onresize onselect onsubmit onunload O Evento ocorre quando: A mouse button is pressed The mouse is moved The mouse is moved off an element The mouse is moved over an element A mouse button is released The reset button is clicked A window or frame is resized Text is selected The submit button is clicked The user exits the page

38 Propriedade altkey button clientx clienty ctrlkey metakey relatedtarget screenx screeny shiftkey Descrição Returns whether or not the "ALT" key was pressed when an event was triggered Returns which mouse button was clicked when an event was triggered Returns the horizontal coordinate of the mouse pointer when an event was triggered Returns the vertical coordinate of the mouse pointer when an event was triggered Returns whether or not the "CTRL" key was pressed when an event was triggered Returns whether or not the "meta" key was pressed when an event was triggered Returns the element related to the element that triggered the event Returns the horizontal coordinate of the mouse pointer when an event was triggered Returns the vertical coordinate of the mouse pointer when an event was triggered Returns whether or not the "SHIFT" key was pressed when an event was triggered

39 <img name="foto" src="minha_foto.gif" onabort="alert('você não viu minha foto')"> <input type="text" value="" name="nome" onblur="verificarnome(this.value)"> <input type="button" value="resultado" onclick="somar(this.form)"> <input type="button" value="resultado" onclick="alert('teste')">

40