recursal/MDN huggingface dataset:
Node.textContent
================

La propiedad **`textContent`** de la interfaz `Node` representa el contenido de texto de un nodo y sus dencendientes.

**Nota:** `textContent` y `HTMLElement.innerText` (en-US) son confundidos con facilidad, pero ambos son diferentes en varias formas importantes.

Sintaxis
--------
```

var text = Node.textContent;
Node.textContent = string;
```

### Valor devuelto

Una cadena de texto o `null`

Descripción
-----------

Al obtener esta propiedad:

* Si el nodo es un documento, un DOCTYPE, o una notation, `textContent` devuelve `null`. (Para obtener todo el texto y los datos de CDATA data (en-US) del documento completo, uno podría usar `document.documentElement.textContent`.)
* Si el nodo es una sección CDATA (en-US), un comentario, una instrucción de procesamiento (en-US), o un nodo de texto, `textContent` devuelve el texto dentro del nodo, por ejemplo, el `Node.nodeValue`.
* Para otros tipos de nodos, `textContent` retorna la concatenación del atributo `textContent` de todos los nodos hijos, excluyendo los nodos comentario y los nodos de instrucciones. Esto es una cadena vacía si el nodo no tiene hijos.

Estableciendo `textContent` en un nodo elimina todos sus hijos y los reemplaza con un solo nodo de texto con el valor dado.

### Diferencias con innerText

Internet Explorer introdujo `elemento.innerText`. La intención es muy parecida, con un par de diferencias:

* Note que mientras `textContent` lee el contenido de todos los elementos, incluyendo los elementos `<script>` (en-US) y `<style>`, `innerText`, no.
* `innerText` también tiene en cuenta el estilo y no retornará el texto de elementos escondidos, mientras que `textContent` sí lo hará.
* Como `innerText` tiene en cuenta el estilo CSS, escribirlo disparará un reflow, mientras que `textContent` no lo hará.
### Diferencias con innerHTML

`innerHTML` retorna el HTML como su nombre indica. Con bastante frecuencia, para leer o escribir texto en un elemento, la gente usa `innerHTML`. `textContent` debería usarse en su lugar. Ya que el texto no es procesado es más probable que tenga mejor rendimiento. Además, esto evita un vector de ataques XSS.

Ejemplo
-------


```js
// Dado el siguiente fragmento HTML:
// <div id="divA">Esto <span>es</span>un texto</div>

// Lee el contenido textual:
var text = document.getElementById("divA").textContent;
// |text| contiene la cadena "Esto es un texto".

// Escribe el contenido textual:
document.getElementById("divA").textContent = "Esto es un nuevo texto";
// El HTML "divA" ahora contiene una nueva cadena:
// <div id="divA">Esto es un nuevo texto</div>
```

Especificaciones
----------------

| Specification |
| --- |
| DOM Standard # dom-node-textcontent |

Compatibilidad con navegadores
------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
Node.childNodes
===============

La propiedad de solo lectura **`Node.childNodes`** devuelve una colección de hijos `nodes` del elemento dado donde el primer nodo hijo es asignado un índice 0.

Sintaxis
--------
```

var nodeList = elementNodeReference.childNodes;
```

Ejemplos
--------

### Uso simple


```js
// parg is an object reference to a <p> element

// First check that the element has child nodes
if (parg.hasChildNodes()) {
  var children = parg.childNodes;

  for (var i = 0; i < children.length; i++) {
    // do something with each child as children[i]
    // NOTE: List is live, adding or removing children will change the list
  }
}
```

### Eliminar todos los hijos de un nodo


```js
// This is one way to remove all children from a node
// box is an object reference to an element

while (box.firstChild) {
  //The list is LIVE so it will re-index each call
  box.removeChild(box.firstChild);
}
```

Notas
-----

Los items en una colección de nodos son objetos y no cadenas de caracteres. Para obtener los datos de los objetos del nodo, use sus propiedades (ej. `elementNodeReference.childNodes[1].nodeName` para obtener el nombre, etc.).

El objeto `document` contiene 2 hijos: la declaración del Doctype y el elemento raíz, generalmente referido como `documentElement`. (En documentos (X)HTML es el elemento `HTML`)

`childNodes` incluye todos los nodos hijos, incluidos los nodos no elementos, como nodos de tipo textos y comentarios. Para obtener una colección de solo elementos, use `ParentNode.children` (en-US).

Especificaciones
----------------

| Specification |
| --- |
| DOM Standard # ref-for-dom-node-childnodes① |

Compatibilidad con navegadores
------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Vea también
-----------

* `Node.firstChild` (en-US)
* `Node.lastChild`
* `Node.nextSibling`
* `Node.previousSibling`
* `ParentNode.children` (en-US)
Node.hasChildNodes()
====================

El método **`Node.hasChildNodes()`** devuelve un valor **Boolean** indicando si el `Node` (nodo) actual tiene nodos hijos o no.

Sintaxis
--------
```

resultado = node.hasChildNodes();
```


`resultado`

almacena el valor devuelto `true` o `false`.

Ejemplos
--------

El siguiente ejemplo elimina el primer nodo dentro del elemento con id `"foo"` si *foo* tiene nodos hijos.


```js
var foo = document.getElementById("foo");
if (foo.hasChildNodes()) {
  // do something with 'foo.childNodes'
}
```

Polyfill
--------


```js
(function (prototype) {
  prototype.hasChildNodes =
    prototype.hasChildNodes ||
    function () {
      return !!this.firstChild;
    };
})(Node.prototype);
```

Resumen
-------

Hay varias maneras de determinar si el nodo tiene nodos hijos.

* node.hasChildNodes()
* node.firstChild != null (o sólo node.firstChild)
* node.childNodes && node.childNodes.length (o node.childNodes.length > 0)
Especificaciones
----------------

| Specification |
| --- |
| DOM Standard # ref-for-dom-node-haschildnodes① |

Compatibilidad con navegadores
------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Ver también
-----------

* `Node.childNodes`
* `Node.hasAttributes`
Node.replaceChild()
===================

El método **`Node.replaceChild()`** reemplaza un nodo hijo del elemento especificado por otro.

Sintáxis
--------
```

replacedNode = parentNode.replaceChild(newChild, oldChild);
```


* `newChild` es el nuevo nodo con el que reemplazar `oldChild`. Si ya existe en el DOM, será eliminado previamente.
* `oldChild` es el nodo existente para ser reemplazado.
* `replacedNode` es el nodo reemplazado. Es el mismo nodo que `oldChild`.
Ejemplo
-------


```js
// <div>
// <span id="childSpan">foo bar</span>
// </div>

// crear un nodo con un elemento vacío
// sin ID, atributos, ni contenido
var sp1 = document.createElement("span");

// darle un atributo id llamado 'newSpan'
sp1.setAttribute("id", "newSpan");

// crear algún contenido para el nuevo elemento
var sp1_content = document.createTextNode(
  "Nuevo elemento span para reemplazo.",
);

// aplicar dicho contenido al nuevo elemento
sp1.appendChild(sp1_content);

// construir una referencia al nodo existente que va a ser reemplazado
var sp2 = document.getElementById("childSpan");
var parentDiv = sp2.parentNode;

// reemplazar el nodo sp2 existente con el nuevo elemento span sp1
parentDiv.replaceChild(sp1, sp2);

// resultado:
// <div>
// <span id="newSpan">Nuevo elemento span para reemplazo.</span>
// </div>
```

Especificación
--------------

* DOM Level 1 Core: replaceChild
* DOM Level 2 Core: replaceChild
* DOM Level 3 Core: replaceChild
Ver también
-----------

* `Node.removeChild`
Node.parentNode
===============

La propiedad de sólo lectura **`node.parentNode`** devuelve el padre del nodo especificado en el árbol.

Sintaxis
--------
```

parentNode = node.parentNode
```


parentNode es el padre del nodo actual. El padre de un elemento es un nodo del tipo `Element`, un nodo `Document`, o un nodo `DocumentFragment.`

Ejemplo
-------


```js
if (node.parentNode) {
  // Borra un nodo del árbol a no ser que
  // esté ya en el árbol
  node.parentNode.removeChild(node);
}
```

Notas
-----

Los nodos del tipo `Document` y `DocumentFragment` nunca van a tener un elemento padre, `parentNode` devolverá siempre `null`.

También devuelve `null` si el nodo acaba de ser creado y no está atado/incorporado al árbol.

Especificaciones
----------------

| Specification |
| --- |
| DOM Standard # ref-for-dom-node-parentnode① |

Compatibilidad con navegadores
------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Ver también
-----------

* `Node.firstChild` (en-US)
* `Node.lastChild`
* `Node.childNodes`
* `Node.nextSibling`
* `Node.parentElement`
* `Node.previousSibling`
* `Node.removeChild`
Node.ownerDocument
==================

La propiedad de lectura **`ownerDocument`** de la interfaz `Node` devuelve el objeto Document de más alto nivel/jerarquia para ese nodo.

Sintaxis
--------
```

var document = element.ownerDocument;
```

### Resultado

`document` es el objeto `Document` de más alto nivel, con el que todos los nodos descendientes se crean. Si la propiedad se usa en un nodo que el mismo es un Document, el resultado es `null`.

Ejemplo
-------


```js
// dado un nodo "p", coge el hijo que tenga la más alta jerarquia
// del objeto Document

var d = p.ownerDocument;
var html = d.documentElement;
```

Especificaciones
----------------

| Specification |
| --- |
| DOM Standard # ref-for-dom-node-ownerdocument① |

Compatibilidad con navegadores
------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
Node.previousSibling
====================

La propiedad de sólo-lectura **`Node.previousSibling`** devuelve el nodo inmediatamente anterior al especificado en la lista de nodos `childNodes` de su padre, o `null` si el nodo especificado es el primero en dicha lista.

Sintaxis
--------
```

nodoAnterior = nodo.previousSibling;
```

Ejemplo
-------


```html
<img id="b0" />
<img id="b1" />
<img id="b2" />
```



```js
console.log(document.getElementById("b1").previousSibling); // <img id="b0">
console.log(document.getElementById("b2").previousSibling.id); // "b1"
```

Notas
-----

 Gecko-based browsers insert text nodes into a document to represent whitespace in the source markup.
 Therefore a node obtained, for example, using `Node.firstChild` (en-US) or `Node.previousSibling` may refer to a
 whitespace text node rather than the actual element the author intended to get.

 See Whitespace in the DOM (en-US) and
 W3C DOM 3 FAQ: Why are some Text nodes empty?
 for more information.

Para navegar en el sentido opuesto de la lista de nodos hijos se utiliza Node.nextSibling.

Especificaciones
----------------

| Specification |
| --- |
| DOM Standard # ref-for-dom-node-previoussibling① |

Compatibilidad con navegadores
------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Ver también
-----------

* `Node.nextSibling`
Node.parentElement
==================

La propiedad de sólo lectura de **`Nodo.parentElement`** devuelve el nodo padre del DOM `Element`, o `null`, si el nodo no tiene padre o si el padre no es un `Element` DOM .

Sintaxis
--------
```

elementoPadre = node.parentElement
```


El `elementoPadre` es el padre del nodo actual. Esto es siempre un objecto `Element` DOM, o `null`.

Ejemplo
-------


```js
if (node.parentElement) {
  node.parentElement.style.color = "red";
}
```

Especificaciones
----------------

| Specification |
| --- |
| DOM Standard # ref-for-dom-node-parentelement① |

Compatibilidad con navegadores
------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Ver también
-----------

* `Node.parentNode`
GlobalEventHandlers.onselectstart
=================================

**Experimental:** **Esta es una tecnología experimental**  
Comprueba la Tabla de compabilidad de navegadores cuidadosamente antes de usarla en producción.

La propiedad **`GlobalEventHandlers.onselectstart`** representa el manejador de evento que es invocado cuando un evento `selectstart` alcanza el objeto.

Sintaxis
--------
```

obj.onselectstart = function;
```


* `function` es el nombre de una función definida por el usuario, sin el sufijo () ni ningún parámetro, o una declaración de función anónima.
Ejemplo
-------


```html
document.onselectstart = function() { console.log("¡Selección iniciada!"); };
```

Especificaciones
----------------

| Specification |
| --- |
| Selection API # selectstart-event |
| Selection API # dom-globaleventhandlers-onselectstart |

Compatibilidad con navegadores
------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Ver también
-----------

* `selectstart`
* `Document.onselectionchange` (en-US) and `selectionchange`.
Node.nodeValue
==============

La propiedad **`Nodo.nodeValue`** devuelve o actualiza el valor del nodo actual.

Sintaxis
--------
```

valor= nodo.nodeValue;
```


`valor` es una cadena contenedora del valor del nodo actual, si es que tiene alguno.

Notas
-----

Para el nodo en si, `nodeValue` devuelve `null`. Para texto, comentarios, y nodos CDATA, `nodeValue` devuelve el contenido de dicho nodo. Para nodos atributos, el valor del atributo es devuelto.

La siguiente table muestra los distintos valores retornados por los diferentes elementos.

| Atributo | valor del atributo |
| --- | --- |
| CDATASection | contenido de la sección CDATA |
| Comment | Contenido del comentario |
| Document | null |
| DocumentFragment | null |
| DocumentType | null |
| Element | null |
| NamedNodeMap | null |
| EntityReference | null |
| Notation | null |
| ProcessingInstruction | Todo el contexto excluyendo el objetivo |
| Text | Contenido del nodo de texto |

Cuando `nodeValue` es definido como `null`, actualizarlo no tiene efecto.

Especificación
--------------

* DOM Level 2 Core: Node.nodeValue
HTMLMediaElement.paused
=======================

La propiedad **`HTMLMediaElement.paused`** es solo de lectura, indica si el elemento multimedia está en pausa.

Sintaxis
--------
```

var pausado = audioOVideo.paused
```

### Valor

Es un `Boolean` (en-US). Mostrara **true** si está pausado y **false** en caso contrario.

Ejemplo
-------


```js
var obj = document.createElement("video");
console.log(obj.paused); // true
```

Especificaciones
----------------

| Specification |
| --- |
| HTML Standard # dom-media-paused-dev |

Compatibilidad con navegadores
------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Ver también
-----------

* La interfaz que lo define, `HTMLMediaElement`.
HTMLMediaElement: canplay
=========================

El evento `canplay` es activado cuando el *user agent (en-US)* puede reproducir contenido multimedia, pero estima que no han sido cargados suficientes datos para reproducir el contenido multimedia hasta su final sin tener que parar para cargar más contenido.

Este evento no es cancelable y no escala a sus padres (*bubble*).

Sintaxis
--------

Se puede usar el nombre del evento en métodos como `addEventListener()`, o establecerlo como una propiedad manejadora de eventos.


```js
addEventListener("canplay", (event) => {});

oncanplay = (event) => {};
```

Tipo de evento
--------------

Un objeto `Event` genérico.

Ejemplos
--------

Estos ejemplos agregan un detector de eventos para el evento `canplay` del objeto HTMLMediaElement, después envían un mensaje cuando ese manejador de eventos ha reaccionado a la activación del evento.

Usando `addEventListener()`:


```js
const video = document.querySelector("video");

video.addEventListener("canplay", (event) => {
  console.log(
    "El video puede iniciar, pero sin la seguridad de que pueda ser reproducido.",
  );
});
```


Usando la propiedad manejadora de eventos `oncanplay`:


```js
const video = document.querySelector("video");

video.oncanplay = (event) => {
  console.log(
    "El video puede iniciar, pero sin la seguridad de que pueda ser reproducido.",
  );
};
```

Especificaciones
----------------

| Specification |
| --- |
| HTML Standard # event-media-canplay |
| HTML Standard # handler-oncanplay |

Compatibilidad con navegadores
------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Eventos relacionados
--------------------

* El evento HTMLMediaElement `playing` (en-US)
* El evento HTMLMediaElement `waiting` (en-US)
* El evento HTMLMediaElement `seeking` (en-US)
* El evento HTMLMediaElement `seeked` (en-US)
* El evento HTMLMediaElement `ended` (en-US)
* El evento HTMLMediaElement `loadedmetadata` (en-US)
* El evento HTMLMediaElement `loadeddata`
* El evento HTMLMediaElement `canplay`
* El evento HTMLMediaElement `canplaythrough` (en-US)
* El evento HTMLMediaElement `durationchange` (en-US)
* El evento HTMLMediaElement `timeupdate`
* El evento HTMLMediaElement `play` (en-US)
* El evento HTMLMediaElement `pause` (en-US)
* El evento HTMLMediaElement `ratechange` (en-US)
* El evento HTMLMediaElement `volumechange` (en-US)
* El evento HTMLMediaElement `suspend` (en-US)
* El evento HTMLMediaElement `emptied` (en-US)
* El evento HTMLMediaElement `stalled` (en-US)
Véase también
-------------

* `HTMLAudioElement`
* `HTMLVideoElement`
* `<audio>`
* `<video>`
HTMLMediaElement: timeupdate
============================

El evento `timeupdate` es llamado cuando el tiempo indicado por el atributo `currentTime` es actualizado.

La frecuencia del evento depende de la carga del sistema, pero se encuentra en un rango de 4Hz y 66Hz (asumiendo que los manejadores de eventos no toman mas de 250ms para correr). Se recomienda a los User agents variar la frecuencia del evento basados en la carga del sistema y el costo promedio de procesamiento del evento cada vez que corre, para que las actualizaciones a la UI no sean mas frecuentes que las que el user agent puede manejar confortablemente mientras se decodifica el video.

Información General
-------------------

Specification

HTML5 media

Interface

Event

Bubbles

No

Cancelable

No

Target

Element

Default Action

None.

Propiedades
-----------

| Property | Type | Description |
| --- | --- | --- |
| `target` Read only  | `EventTarget` | The event target (the topmost target in the DOM tree). |
| `type` Read only  | `DOMString` | The type of event. |
| `bubbles` Read only  | `Boolean` | Whether the event normally bubbles or not. |
| `cancelable` Read only  | `Boolean` | Whether the event is cancellable or not. |

Eventos Relacionados
--------------------

* `playing` (en-US)
* `waiting` (en-US)
* `seeking` (en-US)
* `seeked` (en-US)
* `ended` (en-US)
* `loadedmetadata` (en-US)
* `loadeddata` (en-US)
* `canplay`
* `canplaythrough` (en-US)
* `durationchange` (en-US)
* `timeupdate`
* `play` (en-US)
* `pause` (en-US)
* `ratechange` (en-US)
* `volumechange` (en-US)
* `suspend` (en-US)
* `emptied` (en-US)
* `stalled` (en-US)
HTMLMediaElement.pause()
========================

El método **`HTMLMediaElement.pause()`** pausará la reproducción de los medios, si los medios ya están en pausa, este método no tendrá efecto.

Sintaxis
--------
```

HTMLMediaElement.pause()
```

### Parametros

Ninguno.

### Valor de retorno

Ninguno.

### Excepciones

Ninguno.

Especificaciones
----------------

| Specification |
| --- |
| HTML Standard # dom-media-pause-dev |

Compatibilidad con navegadores
------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLMediaElement: loadeddata event
==================================

El evento **`loadeddata`** se arroja cuando el cuadro en la posición de reproducción actual del medio ha terminado de cargarse; a menudo el primer marco

|  |  |
| --- | --- |
| Burbujas | No |
| Cancelable | No |
| Interfaz | `Event` |
| Objetivo | Element |
| Acción por defecto | Ninguno |
| Propiedad del controlador de eventos | `GlobalEventHandlers.onloadeddata` (en-US) |
| Especificación | HTML5 media |

**Nota:** Tenga en cuenta que este evento no se activará en dispositivos móviles / tablet, si el protector de datos está activado en configuración del navegador.

Ejemplos
--------

Estos ejemplos agregan un escucha de eventos para el evento de `loadeddata` del HTMLMediaElement, luego publican un mensaje cuando ese controlador de eventos ha respondido al disparo del evento.

Utilizando `addEventListener()`:


```js
const video = document.querySelector("video");

video.addEventListener("loadeddata", (event) => {
  console.log(
    "Hurra! El readyState solo aumentó a " +
      "HAVE\_CURRENT\_DATA or mayor por primera vez.",
  );
});
```


Utilizando el `onloadeddata` propiedad del controlador de eventos:


```js
const video = document.querySelector("video");

video.onloadeddata = (event) => {
  console.log(
    "Hurra! El readyState solo aumentó a " +
      "HAVE\_CURRENT\_DATA or mayor por primera vez.",
  );
};
```

Especificaciones
----------------

| Specification |
| --- |
| HTML Standard # event-media-loadeddata |
| HTML Standard # handler-onloadeddata |

Compatibilidad con navegadores
------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Eventos Relacionados
--------------------

* `HTMLMediaElement: playing event` (en-US)
* `HTMLMediaElement: waiting event` (en-US)
* `HTMLMediaElement: seeking event` (en-US)
* `HTMLMediaElement: seeked event` (en-US)
* `HTMLMediaElement: ended event` (en-US)
* `HTMLMediaElement: loadedmetadata event` (en-US)
* `HTMLMediaElement: loadeddata event`
* `HTMLMediaElement: canplay event`
* `HTMLMediaElement: canplaythrough event` (en-US)
* `HTMLMediaElement: durationchange event` (en-US)
* `HTMLMediaElement: timeupdate event`
* `HTMLMediaElement: play event` (en-US)
* `HTMLMediaElement: pause event` (en-US)
* `HTMLMediaElement: ratechange event` (en-US)
* `HTMLMediaElement: volumechange event` (en-US)
* `HTMLMediaElement: suspend event` (en-US)
* `HTMLMediaElement: emptied event` (en-US)
* `HTMLMediaElement: stalled event` (en-US)
Ver También
-----------

* `HTMLAudioElement`
* `HTMLVideoElement`
* `<audio>`
* `<video>`
Stylesheet.deleteRule
=====================

### Resumen

El método **deleteRule** elimina una regla de la hoja de estilos actual.

### Sintaxis
```

stylesheet.deleteRule(index)
```

### Parámetros

* `index` es un numero de tipo long, que indica la posición de la regla.
### Ejemplo
```

 myStyles.deleteRule(0);
```

### Especificación

deleteRule