Successfully reported this slideshow.

Clase06

0

Share

Upcoming SlideShare
Clase22
Clase22
Loading in …3
×
1 of 12
1 of 12

Clase06

0

Share

Download to read offline

Introducción al uso de scripts en páginas HTML. Explicación del concepto de contenido dinámico. Principales USOS. DHMTL y DOM. Estructura de las instrucciones, ejemplos. Flujo de ejecución con scripts.

Introducción al uso de scripts en páginas HTML. Explicación del concepto de contenido dinámico. Principales USOS. DHMTL y DOM. Estructura de las instrucciones, ejemplos. Flujo de ejecución con scripts.

More Related Content

Related Books

Free with a 14 day trial from Scribd

See all

Related Audiobooks

Free with a 14 day trial from Scribd

See all

Clase06

  1. 1. Páginas dinámicas Leonel Morales Díaz Ingeniería Simple [email_address] Disponible en: http://www.ingenieriasimple.com/introprogra Copyright 2008 by Leonel Morales Díaz – Ingeniería Simple. Derechos reservados
  2. 2. Scripts en Páginas <ul><li><HTML> </li></ul><ul><li><Head> </li></ul><ul><li><Script Language=“VBScript”> </li></ul><ul><li>... </li></ul><ul><li></Script> </li></ul><ul><li></Head> </li></ul><ul><li><Body> </li></ul><ul><li><Script Language=“VBScript”> </li></ul><ul><li>... </li></ul><ul><li></Script> </li></ul><ul><li></Body> </li></ul><ul><li></HTML> </li></ul><ul><li><HTML> </li></ul><ul><li><Head> </li></ul><ul><li><Script Language=“javascript”> </li></ul><ul><li>... </li></ul><ul><li></Script> </li></ul><ul><li></Head> </li></ul><ul><li><Body> </li></ul><ul><li><Script Language=“javascript”> </li></ul><ul><li>... </li></ul><ul><li></Script> </li></ul><ul><li></Body> </li></ul><ul><li></HTML> </li></ul>
  3. 3. Uso de Scripts <ul><li>Construcción sobre la marcha </li></ul><ul><ul><li>En base a parámetros </li></ul></ul><ul><ul><li>Document.Write </li></ul></ul><ul><li>Modificación de la página </li></ul><ul><ul><li>DHTML: Dynamic HTML </li></ul></ul><ul><ul><li>DOM: Document Object Model </li></ul></ul><ul><li>Responder a acciones de usuario </li></ul>
  4. 4. Ejemplo <ul><li><HTML> </li></ul><ul><li><Head><Title>Esta página se construye dinámicamente</Title></Head> </li></ul><ul><li><Body> </li></ul><ul><li><H1>Esta tabla de 20x40 se construye dinámicamente</H1> </li></ul><ul><li><Div Align=Center><Table Border=1 Width=80%> </li></ul><ul><li><Script Language=“VBScript”> </li></ul><ul><li>Option Explicit </li></ul><ul><li>Dim i,j </li></ul><ul><li>For i=1 To 20 </li></ul><ul><li>Document.Write “<TR>” </li></ul><ul><li>For j=1 To 40 </li></ul><ul><li>Document.Write “<TD>&nbsp;</TD>” </li></ul><ul><li>Next </li></ul><ul><li>Next </li></ul><ul><li></Script> </li></ul><ul><li></Table></Div></Body></HTML> </li></ul>ej036.html
  5. 5. Una Página Sencilla <ul><li><HTML> </li></ul><ul><li><Head> </li></ul><ul><li><Title>Esta página se construye dinámicamente</Title> </li></ul><ul><li></Head> </li></ul><ul><li><Body> </li></ul><ul><li><Script Language=“VBScript”> </li></ul><ul><li>Document.Write “<P Align=Center><B>¡Hola a Todos!</B></P>” </li></ul><ul><li></Script> </li></ul><ul><li></Body></HTML> </li></ul>ej037.html
  6. 6. Elementos de la Instrucción Document.Write “<P Align=Center><B>¡Hola a Todos!</B></P>” <ul><li>Cadena de Caracteres: </li></ul><ul><li>AKA: String </li></ul><ul><li>Sucesión de caracteres </li></ul><ul><li>Entre comillas </li></ul><ul><li>Común en los lenguajes </li></ul><ul><li>Instrucción: </li></ul><ul><li>Método Write </li></ul><ul><li>Del objeto Document </li></ul><ul><li>Parte del DOM </li></ul><ul><li>Escribe en el documento </li></ul>
  7. 7. Elementos de la Instrucción Document.Write “<P Align=Center><B>¡Hola a Todos!</B></P>” <ul><li>Parámetros: </li></ul><ul><li>Con qué hacerlo </li></ul><ul><li>Instrucción: </li></ul><ul><li>Lo que hay que hacer </li></ul>
  8. 8. Flujo de la Ejecución <ul><li><HTML> </li></ul><ul><li><Head> </li></ul><ul><li><Title>Esta página se construye dinámicamente</Title> </li></ul><ul><li></Head> </li></ul><ul><li><Body> </li></ul><ul><li><Script Language=“VBScript”> </li></ul><ul><li>Document.Write “<P Align=Center><B>¡Hola a Todos!</B></P>” </li></ul><ul><li></Script> </li></ul><ul><li></Body></HTML> </li></ul>1. Se procesa lo “estático” 2. Se procesa el script 3. Se procesa lo “estático” de después del script
  9. 9. Ejemplo <ul><li><HTML> </li></ul><ul><li><Head><Title>Esta página se construye dinámicamente</Title></Head> </li></ul><ul><li><Body> </li></ul><ul><li><H1>Esta tabla de 20x40 se construye dinámicamente</H1> </li></ul><ul><li><Div Align=Center><Table Border=1 Width=80%> </li></ul><ul><li><Script Language=“VBScript”> </li></ul><ul><li>Option Explicit </li></ul><ul><li>Dim i,j </li></ul><ul><li>For i=1 To 20 </li></ul><ul><li>Document.Write “<TR>” </li></ul><ul><li>For j=1 To 40 </li></ul><ul><li>Document.Write “<TD>&nbsp;</TD>” </li></ul><ul><li>Next </li></ul><ul><li>Next </li></ul><ul><li></Script> </li></ul><ul><li></Table></Div></Body></HTML> </li></ul>
  10. 10. Poder de los Scripts <ul><li><Body> </li></ul><ul><li><Script Language=“VBScript”> </li></ul><ul><li>Option Explicit </li></ul><ul><li>Dim Pars,Fils,Cols,Pos </li></ul><ul><li>Pars = Document.Location.Search </li></ul><ul><li>If Pars = “” Then </li></ul><ul><li>Fils = 5 </li></ul><ul><li>Cols = 5 </li></ul><ul><li>Else </li></ul>
  11. 11. Poder de los Scripts <ul><li>Else </li></ul><ul><li>Pars = Replace(Pars,&quot;?&quot;,&quot;&quot;) </li></ul><ul><li>Pars = Replace(Pars,&quot;Fils=&quot;,&quot;&quot;) </li></ul><ul><li>Pars = Replace(Pars,&quot;Cols=&quot;,&quot;&quot;) </li></ul><ul><li>Pars = Replace(Pars,&quot;%26&quot;,&quot;&&quot;) </li></ul><ul><li>Pos = InStr(Pars,&quot;&&quot;) </li></ul><ul><li>Fils = CLng(Left(Pars,Pos-1)) </li></ul><ul><li>Cols = CLng(Right(Pars,Len(Pars)-Pos)) </li></ul><ul><li>End If </li></ul><ul><li>Document.Write “<H1>Esta tabla de “ & Fils & “x” & Cols & “ se construye dinámicamente</H1>” </li></ul><ul><li></Script> </li></ul>
  12. 12. Poder de los Scripts <ul><li><Div Align=Center><Table Border=1 Width=80%> </li></ul><ul><li><Script Language=“VBScript”> </li></ul><ul><li>Option Explicit </li></ul><ul><li>Dim i,j </li></ul><ul><li>For i=1 To Fils </li></ul><ul><li>Document.Write “<TR>” </li></ul><ul><li>For j=1 To Cols </li></ul><ul><li>Document.Write “<TD>&nbsp;</TD>” </li></ul><ul><li>Next </li></ul><ul><li>Next </li></ul><ul><li></Script> </li></ul><ul><li></Table></Div></Body></HTML> </li></ul>ej038.html

×