Esta traducción está incompleta. Por favor, ayuda a traducir este artículo del inglés.

La propiedad de sólo lectura ParentNode.firstElementChild retorna el primer hijo del objeto Element, o bien null si no existen elementos hijos.

Esta propiedada fue definida inicialmente en el interfaz puro ElementTraversal. Como este interfaz contenía dos juegos distintos de propiedades, uno orientado a Node que tenía hijos, y otro a aquellos que eran hijos, se trasladaron a dos interfaces puros separados, ParentNode y ChildNode. En este caso, firstElementChild fue movido a ParentNode. Es un cambio de carácter estrictamente técnico que no debería afectar a la compatibilidad.

Sintaxis

var childNode = elementNodeReference.firstElementChild; 

Ejemplo

<p id="para-01">
  <span>First span</span>
</p>

<script type="text/javascript">
  var p01 = document.getElementById('para-01');
  alert(p01.firstElementChild.nodeName)
</script>

En este ejemlpo, la alerta muestra 'span', que es el nombre de la etiqueta del primer nodo hijo dele elemento párrafo.

Polyfill para Internet Explorer 8

Esta propiedad no está soportada con anterioridad a  IE9, así que el siguiente fragmento puede ser usado para añadir el soporte a IE8:

// Source: https://github.com/Alhadis/Snippets/blob/master/js/polyfills/IE8-child-elements.js
if(!("firstElementChild" in document.documentElement)){
    Object.defineProperty(Element.prototype, "firstElementChild", {
        get: function(){
            for(var nodes = this.children, n, i = 0, l = nodes.length; i < l; ++i)
                if(n = nodes[i], 1 === n.nodeType) return n;
            return null;
        }
    });
}

Especificación

Especificación Estado Observaciones
DOM
La definición de 'ParentNode.firstElementChild' en esta especificación.
Living Standard Dividido el interfaz ElementTraversal en ChildNode y ParentNode. Este método queda definido ahora en el segundo.
Los Document y DocumentFragment implementaron los nuevos interfaces.
Element Traversal Specification
La definición de 'ElementTraversal.firstElementChild' en esta especificación.
Obsolete Añadida su definición inicial al interfaz puro ElementTraversal y lo usa en Element.

Compatibilidad con navegadores

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Prestación Chrome Firefox (Gecko) Internet Explorer Opera Safari
Soporte básico (en Element) 1.0 3.5 (1.9.1) 9.0 10.0 4.0
Soporte en Document y DocumentFragment 29.0 25.0 (25.0) Sin soporte 16.0 Sin soporte
Prestación Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Soporte básico (en Element) (Yes) 1.0 (1.9.1) (Yes) (Yes) (Yes)
Soporte en Document y DocumentFragment (Yes) 25.0 (25.0) Sin soporte 16.0 Sin soporte

Ver también

Etiquetas y colaboradores del documento

Colaboradores en esta página: Grijander81
Última actualización por: Grijander81,