Escriba la palabra ( o parte de ella) en el cuadro de texto inferior.

Luego pulse Enter ...


Hasta el momento durante el presente curso de HTML - JavaScript - PHP,
hemos visto entre otras cosas, algunas de las bases de dicho lenguaje de programación, así como algunos de sus Objetos más importantes.
Otra cosa que debes saber es que los elementos de una página web se encuentran agrupados en una estructura jerárquica denominada DOM (Document Object Model), en la que cada elemento u Objeto contiene a su vez a otros. Cada,(Objeto), uno de ellos se denomina nodo.
El Objeto Document(), que a su vez se halla dentro de Window(), contiene el resto de Objetos (nodos) que hacen referencia a cada uno de los elementos HTML en la página web.

Propiedades de los Objetos del DOM en JavaScript

Cada Objeto que hace referencia a un elemento HTML dentro de la página web posee unas propiedades y eventos que podemos definir desde JavaScript.
A continuación te mostramos algunas de las propiedades genéricas más importantes de los elementos HTML:
className: devolver el nombre de una clase CSS definida, o aplicarla a elemento.
disabled: activar o desactivar el elemento (true/false).
innerHTML: obtiene o define el código HTML de un elemento.
height: alto del elemento
id: identificador del elemento (el definido en la etiqueta HTML )
length: longitud, número de caracteres...
tagName: devuelve el nombre de la etiqueta HTML .
style: permite acceder al Objeto Style(), con el que es posible modificar el estilo de un elemento.
title: título (el definido en el atributo HTML )
width: ancho
Aparte de las propiedades mencionadas, cada elemento HTML dispone de otras propiedades específicas.
Otras propiedades genéricas, usadas para acceder a otros elementos del DOM son:
firstChild: primer elemento encontrado dentro del actual.
lastchild: último elemento encontrado dentro del actual.
nodeName: nombre del elemento.
nodeType: tipo del elemento.
nodeValue: valor del elemento. ownerDocument: acceder al objeto Document() principal.
parentNode: Objeto del DOM dentro del que se encuentra el elemento actual.

Obtener información sobre el Documento

Algunas de las propiedades del Objeto Document() que nos permiten obtener información sobre el documento:
domain: devuelve el nombre del dominio en el que se encuentra alojada la página web.
referrer: devuelve la URL que cargó la página web actual.
Por ejemplo, si tenemos dos páginas web 'index1.html' e 'index2.html' y la segunda ha sido cargada tras hacerse clic en un enlace de la primera, referrer devolvería ésta.
URL: devuelve la URL completa en que se encuentra la página web.
document.write( "domain: " + document.domain );
document.write( "referrer: " + document.referrer );
document.write( "URL: " + document.URL );
También dispone de las siguientes Colecciones, con las que podemos obtener un array de objetos de determinado tipo:
anchors[]: devuelve un array de objetos Anchor(), que hacen referencia a los textos de los enlaces encontrados.
forms[]: array de objetos Form(), que hacen referencia a los formularios encontrados en la página web.
images[]: array de objetos Image(), que hacen referencia a las imágenes encontradas.
links[]: array de objetos Link(), que hacen referencia a los archivos enlazados a la página web usando la etiqueta HTML .
Como ejemplo, mostramos dos formas de obtener el número de enlaces que hay en la página web:
var aEnlaces = document.anchors;
document.write( "Hay [" + aEnlaces.length + "] enlace(s) en la página. ); document.write( "Hay [" + document.anchors.length + "] formularios(s) en la página." );

Dimensiones del Documento


Con las propiedades clientHeight y clientWidth obtendremos el alto y ancho visibles del documento (sin incluirse bordes, márgenes ni barras de desplazamiento).
En el siguiente ejemplo usamos el evento onresize() en el Objeto Window(),
para mostrar las dimensiones visibles del Documento
cada vez que se carga el contenido y se redimensiona la ventana: <html> <head> <title>Busca texto</title> <script language="javascript">   window.onload = function()   {   document.body.innerHTML = "clientHeight: " + document.body.clientHeight + "<br />";   document.body.innerHTML += "clientWidth: " + document.body.clientWidth;   }   window.onresize = function()   {   document.body.innerHTML = "clientHeight: " + document.body.clientHeight + "<br />";   document.body.innerHTML += "clientWidth: " + document.body.clientWidth;   } </script> </head> <body> Ejemplo Buscar Palabras </body> </html>

Escribir con JavaScript en un documento HTML

Como hemos anteriormente, con el método write() podremos escribir
directamente en la página web, pudiendo intercalar texto, código HTML y código CSS:
document.write( "Esto es una línea.");
document.write( "<p style='color:red;font-weight:bold;'>Esto es un párrafo.</p>" );
Existe también un método writeln() que agrega un salto de línea, pero para que funcione hay que ponerlo en una etiqueta HTML <pre></pre> También podemos usar la propiedad innerHTML (se borrará el contenido actual del documento) del siguiente modo: document.body.innerHTML = "<p style='color:red;font-weight:bold;'>Esto es un párrafo.</p>";

Advertencia: codigo 'CSS' y código con 'innerHTML', No funcionan bien en la mayoria de Celulares, Androide y Tablet...

.

Funcionan correctamente si estos dispositivos tienen Sistema Operativo Windows o el Navegador Chrome..

Bajar el archivo de texto con el código completo

Volver