Trabajar con relaciones nodo codificar con javascript

Árboles HTML DOM parecen árboles genealógicos en la relación jerárquica entre los nodos. De hecho, los términos técnicos utilizados por los programadores de javascript para describir las relaciones entre los nodos en un árbol toman sus nombres de las relaciones familiares.

  • Cada nodo, excepto el nodo raíz, tiene uno padre.

  • Cada nodo puede tener cualquier número de niños.

  • Los nodos con el mismo padre están hermanos.

Debido a que los documentos HTML suelen tener múltiples elementos que son del mismo tipo, el DOM permite acceder a distintos elementos en una lista de nodos utilizando un número de índice. Por ejemplo, puede hacer referencia a la primera

elemento de un documento como p [0], y la segunda

como nodo de elemento p [1].

Aunque una lista de nodos puede verse como una matriz, no lo es. Usted puede recorrer el contenido de una lista de nodos, pero no puede utilizar métodos de matriz en las listas de nodos.

En este código, los tres

elementos son todos hijos del

elemento. Debido a que tienen el mismo padre, son hermanos.

La Familia HTML

primero


El HTML DOM también proporciona un par de palabras clave para navegar nodos utilizando sus posiciones en relación con sus hermanos o padres. Las propiedades relativas son

  • primer hijo: Hace referencia al primer hijo de un nodo

  • último hijo: Hace referencia al último hijo del nodo

  • nextSibling: Hace referencia al siguiente nodo con el mismo nodo padre

  • previousSibling: Hace referencia al nodo anterior con el mismo nodo padre

Este ejemplo muestra cómo se pueden utilizar estas propiedades relativas a recorrer el DOM.

Las iguanas son No Fun

Las iguanas son nada divertido estar alrededor. Utilice los enlaces de arriba para obtener más información.

Observe que todo el espaciamiento debe ser retirado entre los elementos dentro de la

elemento para que el primer hijo y último hijo propiedades para acceder a los elementos correctos que desea seleccionar y estilo.

Esto es lo que el documento parece cuando previamente en un navegador. Tenga en cuenta que sólo los primeros y los últimos eslabones de la navegación están en negrita.

Vista previa del código en un navegador.
Vista previa del código en un navegador.

Este es un ejemplo del uso del DOM para realizar un cambio en los elementos existentes dentro del documento. Este método de selección de elementos casi nunca se utiliza. Es demasiado propenso a errores y demasiado difíciles de interpretar y utilizar.




» » » » Trabajar con relaciones nodo codificar con javascript