Scribd Logo
Cargar

¡Te damos la bienvenida a Scribd!

  • Pagina Web Datos

    Cargado por

    Franklin Beitia
    15 vistas11 páginas

    Título original

    pagina web datos

    Derechos de autor

    © © All Rights Reserved

    Formatos disponibles

    DOCX, PDF, TXT o lea en línea desde Scribd

    ¿Le pareció útil este documento?

    ¿Este contenido es inapropiado?

    Denunciar este documento

    Copyright:

    © All Rights Reserved
    Descargue como DOCX, PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    15 vistas11 páginas

    Pagina Web Datos

    Cargado por

    Franklin Beitia

    Copyright:

    © All Rights Reserved
    Descargue como DOCX, PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    de 11

    Introducción

    En este trabajo estaremos enfocándonos en realizar un proyecto en donde se


    estará creando una página web en HTML en donde estaremos utilizando lenguaje
    JavaScript para obtener los datos que están incluidos en un archivo de tipo texto
    los cuales se presentaran en una tabla con sus respectivos datos.
    Índice

     Introducción
    o Archivo de datos.txt
    o Código HTML de la Pagina Web en HTML y JavaScript
    o Pantalla capturada del archivo de datos.txt
    o Pantalla capturada de la página web
     Conclusión
     Bibliografía
    Archivo de datos.txt

    Registro1="Mario";

    Registro2="Atencio";

    Registro3="8-782-2289";

    Registro4="233-7867";

    Registro5="matencio@misitio.com";

    Enlace="web.html";

    Registro6="Roberto";

    Registro7="Icaza";

    Registro8="8-582-2149";

    Registro9="393-5517";

    Registro10="ricaza@miweb.com";

    Enlace="web.html";

    Código HTML de la Pagina Web en HTML y JavaScript

    <html>

    <head>

    <script src="Clientes.txt"></script>
    <script type="text/javascript">

    function CargarClientes(){

    document.getElementById("Campo1").innerText=Registro1;
    document.getElementById("Campo2").innerText=Registro2;
    document.getElementById("Campo3").innerText=Registro3;
    document.getElementById("Campo4").innerText=Registro4;
    document.getElementById("Campo5").innerText=Registro5;
    document.getElementById("Campo6").innerText=Registro6;
    document.getElementById("Campo7").innerText=Registro7;
    document.getElementById("Campo8").innerText=Registro8;
    document.getElementById("Campo9").innerText=Registro9;
    document.getElementById("Campo10").innerText=Registro10;

    document.getElementById("CampoEnlace").href=Enlace;
    }
    </script>

    </head>

    <body>

    <a class="btn btn-primary btn-lg" href='javascript:;' onclick="CargarClientes();"


    role="button">
    Mostrar Clientes &raquo;
    </a>

    <form name="form" method="post" action="">


    <table width="393" border="0" align="center" cellpadding="5" cellspacing="1"
    bgcolor="#8ADBFE">
    <tr>

    <td colspan="2" align="center" bgcolor="#FFFFFF">

    <span class="Estilo1">Mostrar Clientes</span> </td>


    </tr>

    <tr>
    <td width="110" bgcolor="#BDEBFE"><strong>Nombre</strong></td><td
    width="260" bgcolor="#CBCBCB">
    <input name="Nombre" type="text" id="Campo1" />
    </td>
    </tr>

    <tr>
    <td bgcolor="#BDEBFE"><strong>Apellido</strong></td>
    <td bgcolor="#CBCBCB"><input name="Apellido" type="text" id="Campo2" />
    </td>
    </tr>

    <tr>
    <td width="110" bgcolor="#BDEBFE"><strong>Cedula</strong></td><td
    width="260" bgcolor="#CBCBCB">
    <input name="Cedula" type="text" id="Campo3" />
    </td>
    </tr>

    <tr>
    <td bgcolor="#BDEBFE"><strong>Telefono</strong></td>
    <td bgcolor="#CBCBCB"><input name="Telefono" type="text" id="Campo4" />
    </td>
    </tr>

    <tr>
    <td bgcolor="#BDEBFE"><strong>Email</strong></td>
    <td bgcolor="#CBCBCB"><input name="Email" type="text" id="Campo5" />
    </td>
    </tr>

    <tr>
    <td width="110" bgcolor="#BDEBFE"><strong>Nombre</strong></td><td
    width="260" bgcolor="#CBCBCB">
    <input name="Nombre" type="text" id="Campo6" />
    </td>
    </tr>

    <tr>
    <td bgcolor="#BDEBFE"><strong>Apellido</strong></td>
    <td bgcolor="#CBCBCB"><input name="Apellido" type="text" id="Campo7" />
    </td>
    </tr>

    <tr>
    <td width="110" bgcolor="#BDEBFE"><strong>Cedula</strong></td><td
    width="260" bgcolor="#CBCBCB">
    <input name="Cedula" type="text" id="Campo8" />
    </td>
    </tr>
    <tr>
    <td bgcolor="#BDEBFE"><strong>Telefono</strong></td>
    <td bgcolor="#CBCBCB"><input name="Telefono" type="text" id="Campo9" />
    </td>
    </tr>

    <tr>
    <td bgcolor="#BDEBFE"><strong>Email</strong></td>
    <td bgcolor="#CBCBCB"><input name="Email" type="text" id="Campo10" />
    </td>
    </tr>

    </table>

    <br />

    <a id="CampoEnlace">Volver a la página anterior</a>

    </body>

    </html>
    Pantalla capturada del archivo de datos.txt

    Pantalla capturada Página web


    Conclusión

    Al dar por concluido este proyecto logramos obtener un aprendizaje muy fructífero
    ya que pudimos aprender el cómo utilizar el lenguaje JavaScript creando una
    función para poder obtener los datos que introducimos manualmente en un archivo
    creado en notepad, el cual es .txt, utilizamos el método getElementById que nos
    sirve para obtener información de un elemento en su documento mediante una ID
    específica y usamos innerText para devolver el elemento de los datos de texto y
    se le asignó un botón para mostrar los datos en una tabla, finalmente para
    terminar se le asignó un enlace para volver a la página web de inicio.
    Bibliografía

     https://msdn.microsoft.com/es-es/library/
    system.windows.forms.htmlelement.innertext(v=vs.110).aspx
     https://www.w3schools.com/jsref/met_document_getelementbyid.asp

    También podría gustarte