SlideShare uses cookies to improve functionality and performance, and to provide you with relevant advertising. If you continue browsing the site, you agree to the use of cookies on this website. See our User Agreement and Privacy Policy.
SlideShare uses cookies to improve functionality and performance, and to provide you with relevant advertising. If you continue browsing the site, you agree to the use of cookies on this website. See our Privacy Policy and User Agreement for details.
Successfully reported this slideshow.
Activate your 14 day free trial to unlock unlimited reading.
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.
Interfaces de Usuarios, Interacción Humano-Computador y Lenguajes de Programación
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.
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.
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> </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.
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.
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.
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.
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.
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> </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.
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.
Poder de los Scripts <ul><li>Else </li></ul><ul><li>Pars = Replace(Pars,"?","") </li></ul><ul><li>Pars = Replace(Pars,"Fils=","") </li></ul><ul><li>Pars = Replace(Pars,"Cols=","") </li></ul><ul><li>Pars = Replace(Pars,"%26","&") </li></ul><ul><li>Pos = InStr(Pars,"&") </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.
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> </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
0 likes
Be the first to like this
Views
Total views
678
On SlideShare
0
From Embeds
0
Number of Embeds
31
You have now unlocked unlimited access to 20M+ documents!
Unlimited Reading
Learn faster and smarter from top experts
Unlimited Downloading
Download to take your learnings offline and on the go
You also get free access to Scribd!
Instant access to millions of ebooks, audiobooks, magazines, podcasts and more.
Read and listen offline with any device.
Free access to premium services like Tuneln, Mubi and more.