recursal/MDN huggingface dataset:
PerformanceObserverEntryList: getEntries() method
=================================================

The **`getEntries()`** method of the `PerformanceObserverEntryList` interface returns a list of explicitly observed performance entry objects. The list's members are determined by the set of entry types specified in the call to the `observe()` method. The list is available in the observer's callback function (as the first parameter in the callback).

Syntax
------


```js
getEntries()
```

### Return value

A list of explicitly observed `PerformanceEntry` objects. The items will be in chronological order based on the entries' `startTime`. If no objects are found, an empty list is returned.

Examples
--------

### Working with getEntries, getEntriesByName and getEntriesByType

The following example shows the difference between the `getEntries()`, `getEntriesByName()`, and `getEntriesByType()` methods.


```js
const observer = new PerformanceObserver((list, obs) => {
  // Log all entries
  let perfEntries = list.getEntries();
  perfEntries.forEach((entry) => {
    console.log(`${entry.name}'s duration: ${entry.duration}`);
  });

  // Log entries named "debugging" with type "measure"
  perfEntries = list.getEntriesByName("debugging", "measure");
  perfEntries.forEach((entry) => {
    console.log(`${entry.name}'s duration: ${entry.duration}`);
  });

  // Log entries with type "mark"
  perfEntries = list.getEntriesByType("mark");
  perfEntries.forEach((entry) => {
    console.log(`${entry.name}'s startTime: ${entry.startTime}`);
  });
});

// Subscribe to various performance event types
observer.observe({
  entryTypes: ["mark", "measure", "navigation", "resource"],
});
```

Specifications
--------------

| Specification |
| --- |
| Performance Timeline # dom-performanceobserverentrylist-getentries |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
PerformanceObserverEntryList: getEntriesByType() method
=======================================================

The **`getEntriesByType()`** method of the `PerformanceObserverEntryList` returns a list of explicitly *observed* performance entry objects for a given performance entry type. The list's members are determined by the set of entry types specified in the call to the `observe()` method. The list is available in the observer's callback function (as the first parameter in the callback).

Syntax
------


```js
getEntriesByType(type)
```

### Parameters

`type`

The type of entry to retrieve such as `"mark"`. The valid entry types are listed in `PerformanceEntry.entryType`.

### Return value

A list of explicitly *observed* `PerformanceEntry` objects that have the specified `type`. The items will be in chronological order based on the entries' `startTime`. If no objects have the specified `type`, or no argument is provided, an empty list is returned.

Examples
--------

### Working with getEntries, getEntriesByName and getEntriesByType

The following example shows the difference between the `getEntries()`, `getEntriesByName()`, and `getEntriesByType()` methods.


```js
const observer = new PerformanceObserver((list, obs) => {
  // Log all entries
  let perfEntries = list.getEntries();
  perfEntries.forEach((entry) => {
    console.log(`${entry.name}'s duration: ${entry.duration}`);
  });

  // Log entries named "debugging" with type "measure"
  perfEntries = list.getEntriesByName("debugging", "measure");
  perfEntries.forEach((entry) => {
    console.log(`${entry.name}'s duration: ${entry.duration}`);
  });

  // Log entries with type "mark"
  perfEntries = list.getEntriesByType("mark");
  perfEntries.forEach((entry) => {
    console.log(`${entry.name}'s startTime: ${entry.startTime}`);
  });
});

// Subscribe to various performance event types
observer.observe({
  entryTypes: ["mark", "measure", "navigation", "resource"],
});
```

Specifications
--------------

| Specification |
| --- |
| Performance Timeline # dom-performanceobserverentrylist-getentriesbytype |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
TreeWalker: parentNode() method
===============================

 The **`TreeWalker.parentNode()`** method moves the current
 `Node` to the first *visible* ancestor node in the document order,
 and returns the found node. If no such node exists, or if it is above the
 `TreeWalker`'s *root node*, it returns `null` and the current
 node is not changed.

Syntax
------


```js
parentNode()
```

### Parameters

None.

### Return value

A `Node` object or `null`.

Examples
--------


```js
const treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW\_ELEMENT,
  {
    acceptNode(node) {
      return NodeFilter.FILTER\_ACCEPT;
    },
  },
  false,
);
const node = treeWalker.parentNode(); // returns null as there is no parent
```

Specifications
--------------

| Specification |
| --- |
| DOM Standard # dom-treewalker-parentnode |

Browser compatibility
---------------------

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

See also
--------

* The `TreeWalker` interface it belongs to.
TreeWalker: previousNode() method
=================================

 The **`TreeWalker.previousNode()`** method moves the current
 `Node` to the previous *visible* node in the document order, and
 returns the found node. If no such node
 exists, or if it is before that the *root node* defined at the object
 construction, it returns `null` and the current node is not changed.

Syntax
------


```js
previousNode()
```

### Parameters

None.

### Return value

A `Node` object or `null`.

Examples
--------


```js
const treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW\_ELEMENT,
  {
    acceptNode(node) {
      return NodeFilter.FILTER\_ACCEPT;
    },
  },
  false,
);
const node = treeWalker.previousNode(); // returns null as there is no parent
```

Specifications
--------------

| Specification |
| --- |
| DOM Standard # dom-treewalker-previousnode |

Browser compatibility
---------------------

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

See also
--------

* The `TreeWalker` interface it belongs to.
TreeWalker: firstChild() method
===============================

 The **`TreeWalker.firstChild()`** method moves the current
 `Node` to the first *visible* child of the current node, and returns
 the found child. If no such child exists, it returns `null` and the current node is not changed.

Syntax
------


```js
firstChild()
```

### Parameters

None.

### Return value

A `Node` object or `null`.

Examples
--------


```js
const treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW\_ELEMENT,
  {
    acceptNode(node) {
      return NodeFilter.FILTER\_ACCEPT;
    },
  },
  false,
);
const node = treeWalker.firstChild(); // returns the first child of the root element, or null if none
```

Specifications
--------------

| Specification |
| --- |
| DOM Standard # dom-treewalker-firstchild |

Browser compatibility
---------------------

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

See also
--------

* The `TreeWalker` interface it belongs to.
TreeWalker: filter property
===========================

 The **`TreeWalker.filter`** read-only property returns a
 `NodeFilter` that is the filtering object associated with the
 `TreeWalker`.

 When creating the `TreeWalker`, the filter object is passed in as the third
 parameter, and its method `acceptNode()` is called on every
 single node to determine whether or not to accept it.

Value
-----

A `NodeFilter` object.

Examples
--------


```js
const treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW\_ELEMENT,
  {
    acceptNode(node) {
      return NodeFilter.FILTER\_ACCEPT;
    },
  },
);
nodeFilter = treeWalker.filter; // document.body in this case
```

Specifications
--------------

| Specification |
| --- |
| DOM Standard # dom-treewalker-filter |

Browser compatibility
---------------------

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

See also
--------

* The `TreeWalker` interface it belongs to.
TreeWalker: currentNode property
================================

 The **`TreeWalker.currentNode`** property represents the
 `Node` which the `TreeWalker` is currently pointing at.

Value
-----

A `Node`.

Examples
--------


```js
const treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW\_ELEMENT,
  {
    acceptNode(node) {
      return NodeFilter.FILTER\_ACCEPT;
    },
  },
);
root = treeWalker.currentNode; // the root element as it is the first element!
```

Specifications
--------------

| Specification |
| --- |
| DOM Standard # ref-for-dom-treewalker-currentnode① |

Browser compatibility
---------------------

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

See also
--------

* The `TreeWalker` interface.
TreeWalker: whatToShow property
===============================

 The **`TreeWalker.whatToShow`** read-only property returns a
 bitmask that indicates the types of
 nodes to show. Non-matching nodes are skipped, but their
 children may be included, if relevant. The possible values are:


| Constant | Numerical value | Description |
| --- | --- | --- |
| `NodeFilter.SHOW_ALL` | `4294967295` (that is the max value of `unsigned long`) | Shows all nodes. |
| `NodeFilter.SHOW_ATTRIBUTE` 
Deprecated
 | `2` | 
 Shows attribute `Attr` nodes. This is meaningful
 only when creating a `TreeWalker` with an
 `Attr` node as its root; in this case, it means
 that the attribute node will appear in the first position of the
 iteration or traversal. Since attributes are never children of other
 nodes, they do not appear when traversing over the document tree.
  |
| `NodeFilter.SHOW_CDATA_SECTION` 
Deprecated
 | `8` | Shows `CDATASection` nodes. |
| `NodeFilter.SHOW_COMMENT` | `128` | Shows `Comment` nodes. |
| `NodeFilter.SHOW_DOCUMENT` | `256` | Shows `Document` nodes. |
| `NodeFilter.SHOW_DOCUMENT_FRAGMENT` | `1024` | Shows `DocumentFragment` nodes. |
| `NodeFilter.SHOW_DOCUMENT_TYPE` | `512` | Shows `DocumentType` nodes. |
| `NodeFilter.SHOW_ELEMENT` | `1` | Shows `Element` nodes. |
| `NodeFilter.SHOW_ENTITY` 
Deprecated
 | `32` | Legacy, no more used. |
| `NodeFilter.SHOW_ENTITY_REFERENCE`

Deprecated
 | `16` | Legacy, no more used. |
| `NodeFilter.SHOW_NOTATION` 
Deprecated
 | `2048` | Legacy, no more used. |
| `NodeFilter.SHOW_PROCESSING_INSTRUCTION` | `64` | Shows `ProcessingInstruction` nodes. |
| `NodeFilter.SHOW_TEXT` | `4` | Shows `Text` nodes. |

Value
-----

A bitmask.

Examples
--------


```js
const treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW\_ELEMENT + NodeFilter.SHOW\_COMMENT + NodeFilter.SHOW\_TEXT,
  { acceptNode: (node) => NodeFilter.FILTER\_ACCEPT },
  false,
);
if (
  treeWalker.whatToShow === NodeFilter.SHOW\_ALL ||
  treeWalker.whatToShow % (NodeFilter.SHOW\_COMMENT \* 2) >=
    NodeFilter.SHOW\_COMMENT
) {
  // treeWalker will show comments
}
```

Specifications
--------------

| Specification |
| --- |
| DOM Standard # dom-treewalker-whattoshow |

Browser compatibility
---------------------

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

See also
--------

* The `TreeWalker` interface.
TreeWalker: lastChild() method
==============================

 The **`TreeWalker.lastChild()`** method moves the current
 `Node` to the last *visible* child of the current node, and returns
 the found child. If no such child exists, it returns `null` and the current node is not changed.

Syntax
------


```js
lastChild()
```

### Parameters

None.

### Return value

A `Node` object or `null`.

Examples
--------


```js
const treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW\_ELEMENT,
  {
    acceptNode(node) {
      return NodeFilter.FILTER\_ACCEPT;
    },
  },
);
const node = treeWalker.lastChild(); // returns the last visible child of the root element
```

Specifications
--------------

| Specification |
| --- |
| DOM Standard # dom-treewalker-lastchild |

Browser compatibility
---------------------

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

See also
--------

* The `TreeWalker` interface it belongs to.
TreeWalker: nextNode() method
=============================

 The **`TreeWalker.nextNode()`** method moves the current
 `Node` to the next *visible* node in the document order, and returns
 the found node. If no such node exists, it returns `null` and the current node is not changed.

Syntax
------


```js
nextNode()
```

### Parameters

None.

### Return value

A `Node` object or `null`.

Examples
--------


```js
const treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW\_ELEMENT,
  {
    acceptNode(node) {
      return NodeFilter.FILTER\_ACCEPT;
    },
  },
  false,
);
const node = treeWalker.nextNode(); // returns the first child of root, as it is the next node in document order
```

Specifications
--------------

| Specification |
| --- |
| DOM Standard # dom-treewalker-nextnode |

Browser compatibility
---------------------

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

See also
--------

* The `TreeWalker` interface it belongs to.
TreeWalker: nextSibling() method
================================

 The **`TreeWalker.nextSibling()`** method moves the current
 `Node` to its next sibling, if any, and returns the found sibling. If there
 is no such node, it returns `null` and the current node is not changed.

Syntax
------


```js
nextSibling()
```

### Parameters

None.

### Return value

A `Node` object or `null`.

Examples
--------


```js
const treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW\_ELEMENT,
  {
    acceptNode(node) {
      return NodeFilter.FILTER\_ACCEPT;
    },
  },
  false,
);
treeWalker.firstChild();
const node = treeWalker.nextSibling(); // returns null if the first child of the root element has no sibling
```

Specifications
--------------

| Specification |
| --- |
| DOM Standard # dom-treewalker-nextsibling |

Browser compatibility
---------------------

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

See also
--------

* The `TreeWalker` interface it belongs to.
TreeWalker: previousSibling() method
====================================

 The **`TreeWalker.previousSibling()`** method moves the current
 `Node` to its previous sibling, if any, and returns the found sibling. If
 there is no such node, it returns `null` and the current node is not changed.

Syntax
------


```js
previousSibling()
```

### Parameters

None.

### Return value

A `Node` object or `null`.

Examples
--------


```js
const treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW\_ELEMENT,
  {
    acceptNode(node) {
      return NodeFilter.FILTER\_ACCEPT;
    },
  },
  false,
);
const node = treeWalker.previousSibling(); // returns null as there is no previous sibling
```

Specifications
--------------

| Specification |
| --- |
| DOM Standard # dom-treewalker-previoussibling |

Browser compatibility
---------------------

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

See also
--------

* The `TreeWalker` interface it belongs to.
TreeWalker: root property
=========================

 The **`TreeWalker.root`** read-only property returns the node
 that is the root of what the TreeWalker traverses.

Value
-----

A `Node` object.

Examples
--------


```js
const treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW\_ELEMENT,
  {
    acceptNode(node) {
      return NodeFilter.FILTER\_ACCEPT;
    },
  },
  false,
);
root = treeWalker.root; // document.body in this case
```

Specifications
--------------

| Specification |
| --- |
| DOM Standard # dom-treewalker-root |

Browser compatibility
---------------------

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

See also
--------

* The `TreeWalker` interface.
HTMLTrackElement: cuechange event
=================================

The **`cuechange`** event fires when a `TextTrack` has changed the currently displaying cues. The event is fired on both the `TextTrack` and the `HTMLTrackElement` in which it's being presented, if any.

Syntax
------

Use the event name in methods like `addEventListener()`, or set an event handler property.


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

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

Event type
----------

A generic `Event` with no added properties.

Examples
--------

The underlying `TextTrack`, indicated by the `track` property, receives a `cuechange` event every time the currently-presented cue is changed. This happens even if the track isn't associated with a media element.

If the track *is* associated with a media element, using the `<track>` element as a child of the `<audio>` or `<video>` element, the `cuechange` event is also sent to the `HTMLTrackElement`.


```js
let textTrackElem = document.getElementById("texttrack");

textTrackElem.addEventListener("cuechange", (event) => {
  let cues = event.target.track.activeCues;
});
```


Alternatively, you can use the `oncuechange` event handler:


```js
let textTrackElem = document.getElementById("texttrack");

textTrackElem.oncuechange = (event) => {
  let cues = event.target.track.activeCues;
};
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # event-media-cuechange |
| HTML Standard # handler-oncuechange |

Browser compatibility
---------------------

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

See also
--------

* WebVTT
* The same event on `TextTrack`: `cuechange`
HTMLTrackElement: src property
==============================

 The **`HTMLTrackElement.src`** property reflects the value of
 the `<track>` element's `src` attribute, which
 indicates the URL of the text track's data.

Value
-----

A string object containing the URL of the text track data.

Example
-------


```js
// coming soon
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-track-src |

Browser compatibility
---------------------

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

See also
--------

* `HTMLTrackElement`: Interface used to define the `HTMLTrackElement.src` property
* `<track>`
CSSValue: cssValueType property
===============================

**Deprecated:** This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.

 The **`cssValueType`** read-only property of the
 `CSSValue` interface represents the type of the current computed CSS
 property value.


**Note:** This property was part of an attempt to create a typed CSS Object Model. This attempt has been abandoned, and most browsers do
 not implement it.


To achieve your purpose, you can use:

* the untyped CSS Object Model, widely supported, or
* the modern CSS Typed Object Model API, less supported and considered experimental.

Value
-----

 An `unsigned short` representing a code defining the type of the value.
 Possible values are:


| Constant | Description |
| --- | --- |
| `CSS_CUSTOM` | The value is a custom value. |
| `CSS_INHERIT` | 
 The value is inherited and the `cssText` contains
 `"inherit"`.
  |
| `CSS_PRIMITIVE_VALUE` | 
 The value is a primitive value and an instance of the
 `CSSPrimitiveValue` interface can be obtained
 by using binding-specific casting methods on this instance of the
 `CSSValue` interface.
  |
| `CSS_VALUE_LIST` | 
 The value is a `CSSValue` list and an instance of the
 `CSSValueList` interface can be obtained by using
 binding-specific casting methods on this instance of the
 `CSSValue` interface.
  |

Examples
--------


```js
const styleDeclaration = document.styleSheets[0].cssRules[0].style;
const cssValue = styleDeclaration.getPropertyCSSValue("color");
console.log(cssValue.cssValueType);
```

Specifications
--------------

 This feature was originally defined in the DOM Style Level 2 specification, but has been dropped from any
 standardization effort since then.

It has been superseded by a modern, but incompatible, CSS Typed Object Model API that is now on the standard track.

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
CSSValue: cssText property
==========================

**Deprecated:** This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.

 The **`cssText`** property of the `CSSValue`
 interface represents the current computed CSS property value.


**Note:** This property was part of an attempt to create a typed CSS Object Model. This attempt has been abandoned, and most browsers do
 not implement it.


To achieve your purpose, you can use:

* the untyped CSS Object Model, widely supported, or
* the modern CSS Typed Object Model API, less supported and considered experimental.

Value
-----

A string representing the current CSS property value.

Examples
--------


```js
const styleDeclaration = document.styleSheets[0].cssRules[0].style;
const cssValue = styleDeclaration.getPropertyCSSValue("color");
console.log(cssValue.cssText);
```

Specifications
--------------

 This feature was originally defined in the DOM Style Level 2 specification, but has been dropped from any
 standardization effort since then.

It has been superseded by a modern, but incompatible, CSS Typed Object Model API that is now on the standard track.

Browser compatibility
---------------------

 This feature was originally defined in the DOM Style Level 2 specification, but has been dropped from any
 standardization effort since then.

It has been superseded by a modern, but incompatible, CSS Typed Object Model API that is now on the standard track.

See also
--------

* `CSSStyleDeclaration.getPropertyCSSValue()`