0
Páginas dinámicas Leonel Morales Díaz Ingeniería Simple [email_address] Disponible en: http://www.ingenieriasimple.com/int...
Scripts en Páginas <ul><li><HTML> </li></ul><ul><li><Head> </li></ul><ul><li><Script Language=“VBScript”> </li></ul><ul><l...
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>...
Ejemplo <ul><li><HTML> </li></ul><ul><li><Head><Title>Esta página se construye dinámicamente</Title></Head> </li></ul><ul>...
Una Página Sencilla <ul><li><HTML> </li></ul><ul><li><Head> </li></ul><ul><li><Title>Esta página se construye dinámicament...
Elementos de la Instrucción Document.Write “<P Align=Center><B>¡Hola a Todos!</B></P>” <ul><li>Cadena de Caracteres: </li>...
Elementos de la Instrucción Document.Write “<P Align=Center><B>¡Hola a Todos!</B></P>” <ul><li>Parámetros: </li></ul><ul><...
Flujo de la Ejecución <ul><li><HTML> </li></ul><ul><li><Head> </li></ul><ul><li><Title>Esta página se construye dinámicame...
Ejemplo <ul><li><HTML> </li></ul><ul><li><Head><Title>Esta página se construye dinámicamente</Title></Head> </li></ul><ul>...
Poder de los Scripts <ul><li><Body> </li></ul><ul><li><Script Language=“VBScript”> </li></ul><ul><li>Option Explicit </li>...
Poder de los Scripts <ul><li>Else </li></ul><ul><li>Pars = Replace(Pars,&quot;?&quot;,&quot;&quot;) </li></ul><ul><li>Pars...
Poder de los Scripts <ul><li><Div Align=Center><Table Border=1 Width=80%> </li></ul><ul><li><Script Language=“VBScript”> <...
Upcoming SlideShare
Loading in...5
×

Clase06

510

Published on

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.

Published in: Technology, Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
510
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
5
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "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
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×