Comunidad de diseño web y desarrollo en internet online

Ayuda en un ejercicio

Citar            
MensajeEscrito el 09 Mar 2015 05:14 pm
Hola estoy en un curso de javascript y me pusieron este ejercicio y no se como resolverlo me podrian ayudar por favor.

escribió:

Construir una página HTML que liste el contenido de todas las propiedades de un objeto en forma de tabla.

El nombre o referencia al objeto se pedirá al usuario utilizando la función prompt, para que lo introduzca a través del cajetín del desplegable generado. Debera aceptar nombres de propiedades de window tales como screen, this.location, document, .. o incluso window. Si el nombre que se introduce por el cajetín referencia algo que no es un objeto, solo se dará un mensaje indicandolo y no habra que listar ninguna tabla.

La tabla HTML tendrá 2 columnas:

La 1a columna contendrá los nombres de las propiedades de objeto
La 2a columna contendrá el valor de la propiedad, siempre que no sea un objeto o función (comprobarlo con el operador "typeof"). Si es un objeto o función se pondrá como valor el string: “no es imprimible”.

Se recomienda utilizar un script que utilice la sentencia “for/in” para extraer las propiedades e insertarlas en la página HTML con formato de tabla. Utilizar dentro del bucle una sentencia "if/else" que comprube con el operador "typeof" si el valor de la propiedad es un string es imprimible o no, para imprimir dicho valor o "no es imprimible".


Este es mi codigo y no se que mas hacer.

Código HTML :

<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8">
      <title>Propiedades en forma de tabla</title>
   </head>

   <style>

   </style>

   <body>
      <header>
      </header>

      <script>
         var obj=prompt("Introduce un objeto y te dire las propiedades:");
         var i;
         var tabla = document.getElementById("tabla");

         if(typeof obj == 'object') 
         {
            for(i in obj) {
            }
         }

         else
         {
            alert("¡El valor introducido no es un objeto!");
         }

      </script>
      <section>
         <table id="tabla">
         </table>
      </section>

   </body>
</html>

Por fernandomrb

0 de clabLevel



 

firefox
Citar            
MensajeEscrito el 13 Mar 2015 09:20 pm
Jajajajaj en serio este tipo de practicas es para que aprendas a desarrollar, a que veas las propiedades, de los objetos...

En fin qui algo sencillo, sin embargo aun tiene un bug con las comillas.

[url=http://jsfiddle.net/elporfirio/ed8wu0wk/ ]http://jsfiddle.net/elporfirio/ed8wu0wk/[/url]

Entonces no funciona con window o document

Por elporfirio

Claber

652 de clabLevel

1 tutorial

Genero:Masculino  

FullStack Web Developer

chrome
Citar            
MensajeEscrito el 13 Mar 2015 09:50 pm
Ahora is una versión más estable :P ya ni se que le hice, pero solo funciona en navegadores.

Código HTML :

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>Imprimir propiedades de los objetos</title>
    <div id="informacion">

    </div>
    <script>
        var getKeys = function(objeto){
            var keys = [];
            for(var key in objeto){
                keys.push(key);
            }
            return keys;
        }

        function ready(fn) {
            if (document.readyState != 'loading'){
                fn();
            } else {
                document.addEventListener('DOMContentLoaded', fn);
            }
        }

        function generarCelda(parametro, valor){
            var parametro2 = safeChars(parametro);
            var valor2 = safeChars(valor);
            return '<tr>' +
                        '<td>' + parametro2.replace(/'/g, ''') + '</td>' +
                        '<td><pre>' + valor2.replace(/'/g, ''') + '</pre></td>' +
                    '</tr>';
        }

        function safeChars(str){
            var string = String(str);
            string = string.replace(/'/g, ''');
            string = string.replace(/</g, '&lt;');  //for <
            string = string.replace(/>/g, '&gt;');  //for >
            return string;
        }

        function solicitarObjeto(){
            var modelo = prompt('introduzca un nombre de objeto');
            var objeto = eval(modelo);
            var celdas = '';

            for(var index in objeto) {
                celdas += generarCelda(index, objeto[index]);
            }

            var tabla = '<table>' +
                            '<tr>' +
                                '<th>Nombre Propiedad</th>'+
                                '<th>Valor propiedad</th>' +
                            '</tr>' +
                            celdas +
                            '</table>';

            var divContenedor = document.getElementById("informacion");

            divContenedor.innerHTML = tabla;

        }

        ready(solicitarObjeto());
    </script>
</head>
<body>

Por elporfirio

Claber

652 de clabLevel

1 tutorial

Genero:Masculino  

FullStack Web Developer

chrome

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.