Nuevo destripador

Este nuevo destripador, está basado en el anterior, pero con alguna mejora, como la vista en estructura de árbol, y la posibilidad de destripar colecciones (arrays).

icono Introducción
icono Destripador manual
icono Navegar desde el objeto window
icono Editar código javascript
pluma

Introducción


El objeto window es la base de todo lo que hay en una página web, equivale a "la raíz" del árbol de objetos de la misma. De este objeto depende su principal rama que es el objeto document, o "window.document".

De window también se desprenden otros objetos importantes, como son los métodos básicos (window.alert, window.open, window.write, window.print...), colecciones de datos (forms, frames) y los atributos, métodos, colecciones y objetos propios, que en ocasiones varían según el navegador.

Tiene mucha importancia el objeto window.document de donde se desprenden los nuevos métodos derivados del DOM, y que heredarán muchas ramas del árbol del documento (hasChildNodes, createElement, appendChild, removeChild, cloneNode, getElementById, getElementsByTagName...) junto a importantes colecciones de datos (images, forms, anchors, childNodes...) e importantes objetos y atributos.

Manual

Destripador manual


Desde esta pestaña disponemos de un campo de texto de formulario, en donde debemos indicar el objeto que vayamos a destripar (o chequear).

Si pulsamos el botón "chequear", en el recuadro de texto adjunto veremos el resultado de aplicar el método typeof al: eval() y al objetor() del texto que hayamos introducido.

Si el typeof del objetor() es "object" (vaya trabalenguas) se activa el botón desglosar, y pulsando sobre el mismo, obtendremos la lista de elementos dependientes de el elemento indicado. Y si entre los elementos dependientes existiesen objetos, se activaría un selector que automáticamente generase un nuevo objeto en el campo de texto de entrada de datos. También se crea dinámicamente la lista de "ascendentes".

navegando

Navegar desde el objeto window


En esta pestaña el acceso a cada objeto es accesible mediante botones, empezando desde el propio objeto window.

Al desplegarse cada objeto, se muestran distintos botones destinados a desplegar el resto de objetos dependientes, a la vez de permitir el despliegue tanto de funciones como de aquellos atributos cuyos valores asociados contengan saltos de línea. Un ejemplo básico es el despliegue del atributo "innerHTML" de cada etiqueta que se acceda, por ejemplo: window.document.body.innerHTML.

editando

Editar código javascript


La pestaña "Editar código javascript" permite modificar el código javascript de la página y luego probarlo usando el botón "probar" que se encuentra al pie de la pestaña. Para usar el código original hay que pulsar el botón "enlazar".

Esta peculiar posibilidad no se recomienda usar a no ser de que se trate de un experimentado programador, ya que se pueden provocar errores no deseados... de todos modos podría ayudar a mejorar el código actual. Si alguien obtiene alguna mejora en el código, recomiendo que me lo haga saber.


Nota: Esta página intenta ser una mejora del destripador original.

Manual

Destripador manual


El funcionamiento manual de este destripador consiste en escribir en el campo de texto el objeto que se quiera destripar, y luego de chequear si se trata de un objeto, pulsar en el botón "desglosar".

Cada vez que se desglosa un objeto nuevo, se genera una lista de los objetos dependientes para facilitar la navegación. Después de seleccionar el nuevo objeto y pulsar el botón adjunto "ir" el campo de entrada de texto se actualiza con el nuevo objeto listo para chequear y luego destripar.

También se crean elementos activos que actualizan el campo de entrada de texto con los progenitores del último elemento seleccionado; esa lista está precedida por Ascendentes.

objeto

Ascententes:
editando

Editar código javascript


En esta pestaña se puede ver el código javascript de esta propia página, pudiéndose modificar y probar, aunque se corre el riesgo de provocar errores inesperados.

A pie de pestaña hay un par de botones con el siguiente significado: "probar" hace que se ejecute el código con las modificaciones que se hagan en él desde la sesión actual. Si se quiere usar el código original de la página debe pulsarse el botón "enlazar".

Si se usa a conciencia, se puede aprender con el código de esta misma página... espero que lo disfruten.


Código


Comentarios

Fecha de envío: 8 de diciembre de 2009, a las 13:56.
comentario:

Estupendo, gracias


Colabore enviando su comentario

Nombre
Procedencia
Página web
E-mail *
Evaluación evaluarevaluarevaluarevaluarevaluarevaluarevaluarevaluarevaluarevaluar
Código de envío

Rellene este campo con la clave de la imagen: codigo de envío

Nota Importante

El campo E-Mail es obligatorio para activar por correo electrónico el comentario (si no desea que se haga público, marque la casilla "anonimato"). También es obligatorio el código "captcha" (el número que se ve en la imagen adjunta); y por supuesto, debe existir un comentario.

Puede encontrar información sobre este sistema de comentarios en este enlace: Ponga comentarios en su web.

Edición negrita cursiva subrayado   alineación izquierda alineación derecha alineación centrada alineación justificada   Insertar enlace insertar imagen   Emoticones: [:)] [:(] [:x] [BIEN] [MAL] [SI] [NO] [APLAUSOS] [MEJORABLE] [¡A VER!] [¡DÉJAME PENSAR!] [FLIPE] [¡SIN PALABRAS!]
Copyright © 2006-2018 www.caricatos.net
Visitas: 9024