recursal/MDN huggingface dataset:
Document: createTouch() method
==============================

**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.

**Non-standard:** This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

The **`Document.createTouch()`** method creates and returns a new `Touch` object.

**Note:** Use the `TouchEvent()` constructor.

Syntax
------


```js
createTouch(view, target, identifier, pageX, pageY, screenX, screenY)
```

### Parameters

**Note:** All parameters are optional.

`view`

The `window` in which the touch occurred.

`target`

The `EventTarget` for the touch.

`identifier`

The value for `Touch.identifier`.

`pageX`

The value for `Touch.pageX`.

`pageY`

The value for `Touch.pageY`.

`screenX`

The value for `Touch.screenX`.

`screenY`

The value for `Touch.screenY`.



**Note:** Previous versions of this method included the
 following additional parameters but those parameters are not included in either of the
 standards listed below. Consequently, these parameters should be considered deprecated
 and not used.


`clientX`

The value for `Touch.clientX`.

`clientY`

The value for `Touch.clientY`.

`radiusX`

The value for `Touch.radiusX`.

`radiusY`

The value for `Touch.radiusY`.

`rotationAngle`

The value for `Touch.rotationAngle`.

`force`

The value for `Touch.force`.

### Return value

`touch`

A `Touch` object configured as described by the input parameters.

Examples
--------

 This example illustrates using the `Document.createTouch()` method to
 create `Touch` objects.

 In following code snippet, two `Touch` objects are created for the
 `target` element.


```js
const target = document.getElementById("target");

const touch1 = document.createTouch(window, target, 1, 15, 20, 35, 40);
const touch2 = document.createTouch(window, target, 2, 25, 30, 45, 50);
```

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

This feature is not part of any current specification. It is no longer on track to become a standard.

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

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

See also
--------

* Touch events
* `TouchList`
* `Touch`
* `Document.createTouchList()`
Document: queryCommandEnabled() method
======================================

**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.

**Non-standard:** This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

 The **`Document.queryCommandEnabled()`** method reports whether
 or not the specified editor command is enabled by the browser.

Syntax
------


```js
document.queryCommandEnabled(command)
```

### Parameters

`command`

The command for which to determine support.

### Return value

 Returns a boolean value which is `true` if the command is enabled
 and `false` if the command isn't`.`

Notes
-----

* For '`cut`' and '`copy`' commands the method only returns true
 when called from a user-initiated thread.
* The `'paste'` command return `false` not only if the feature
 is unavailable, but also if the script calling it has insufficient privileges to
 perform the action.
Example
-------


```js
const flg = document.queryCommandEnabled("SelectAll");

if (flg) {
  document.execCommand("SelectAll", false, null); // command is enabled, run it
}
```

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

This feature is not part of any current specification. It is no longer on track to become a standard.

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

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

See also
--------

* `Document.execCommand()`
* `Document.queryCommandSupported()`
Document: links property
========================

The **`links`** read-only property of the `Document` interface returns a collection of all `<area>` elements and `<a>` elements in a document with a value for the href attribute.

Value
-----

An `HTMLCollection`.

Examples
--------


```js
for (const link of document.links) {
  const linkHref = document.createTextNode(link.href);
  const lineBreak = document.createElement("br");
  document.body.appendChild(linkHref);
  document.body.appendChild(lineBreak);
}
```

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

| Specification |
| --- |
| HTML Standard # dom-document-links-dev |

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

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

 The **`Document.referrer`** property returns the URI of the page that linked to
 this page.

Value
-----

 The value is an empty string if the user navigated to the page directly (not through a
 link, but, for example, by using a bookmark). Because this property returns only a
 string, it doesn't give you document object model (DOM) access to the referring page.

 Inside an `<iframe>`, the `Document.referrer` will initially
 be set to the same value as the `href` of
 the parent window's `Window.location`.

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

| Specification |
| --- |
| HTML Standard # dom-document-referrer-dev |

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

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

 The **`document.title`** property gets or sets the current title of the document.
 When present, it defaults to the value of the `<title>`.

Value
-----

A string containing the *document*'s title. If the title was overridden by setting `document.title`, it contains that value. Otherwise, it contains the title specified in the `<title>` element.


```js
document.title = newTitle;
```


`newTitle` is the new title of the document. The assignment
 affects the return value of `document.title`, the title displayed for the
 document (e.g. in the titlebar of the window or tab), and it also affects the DOM of the
 document (e.g. the content of the `<title>` element in an HTML
 document).

Examples
--------


```html
<!doctype html>
<html lang="en-US">
  <head>
    <meta charset="UTF-8" />
    <title>Hello World!</title>
  </head>
  <body>
    <script>
 alert(document.title); // displays "Hello World!"
 document.title = "Goodbye World!";
 alert(document.title); // displays "Goodbye World!"
 </script>
  </body>
</html>
```

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

| Specification |
| --- |
| HTML Standard # document.title |

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

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

 Returns the Document Type Declaration (DTD) associated with current document. The
 returned object implements the `DocumentType` interface. Use
 `DOMImplementation.createDocumentType()` to create a
 `DocumentType`.

* `doctype` is a read-only property.
Value
-----

A `DocumentType` object.

Examples
--------


```js
const doctypeObj = document.doctype;

console.log(`doctypeObj.name: ${doctypeObj.name}`);
console.log(`doctypeObj.internalSubset: ${doctypeObj.internalSubset}`);
console.log(`doctypeObj.publicId: ${doctypeObj.publicId}`);
console.log(`doctypeObj.systemId: ${doctypeObj.systemId}`);
```

Notes
-----

 The property returns `null` if there is no DTD associated with the current
 document.

DOM level 2 doesn't support editing the document type declaration.

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

| Specification |
| --- |
| DOM Standard # ref-for-dom-document-doctype① |

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

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

The **`pointerlockchange`** event is fired when the pointer is locked/unlocked.

The event handler can use `Document.pointerLockElement` to determine whether the pointer is locked, and if so, to which element it is locked.

This event is not cancelable and does not bubble.

Syntax
------

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


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

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

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

A generic `Event`.

Examples
--------

Using `addEventListener()`:


```js
addEventListener("pointerlockchange", (event) => {
  if (document.pointerLockElement)
    console.log("The pointer is locked to: ", document.pointerLockElement);
  else {
    console.log("The pointer is not locked");
  }
});
```


Using the `onpointerlockchange` event handler property:


```js
document.onpointerlockchange = (event) => {
  if (document.pointerLockElement)
    console.log("The pointer is locked to: ", document.pointerLockElement);
  else {
    console.log("The pointer is not locked");
  }
};
```

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

| Specification |
| --- |
| Pointer Lock 2.0 # pointerlockchange-and-pointerlockerror-events |
| Pointer Lock 2.0 # dom-document-onpointerlockchange |

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

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

See also
--------

* Using Pointer Lock API
Document: fragmentDirective property
====================================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

The **`fragmentDirective`** read-only property of the `Document` interface returns the `FragmentDirective` for the current document.

Value
-----

A `FragmentDirective` object.

Examples
--------

Try running the following in a supporting browser's devtools, in a tab with one or more matched text fragments:


```js
document.fragmentDirective;
// returns an empty FragmentDirective object, if supported
// undefined otherwise
```


This functionality is mainly intended for feature detection at present. In the future, the `FragmentDirective` object could include additional information.

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

| Specification |
| --- |
| URL Fragment Text Directives # dom-document-fragmentdirective |

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

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

See also
--------

* Text fragments
* `::target-text`
Document: xmlVersion 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.

Returns the version number as specified in the XML declaration (e.g., `<?xml version="1.0"?>`) or "1.0" if the declaration is absent.

This attribute was never really useful, since it always returned 1.0, and has been removed in DOM Level 4. As such, Firefox 10 no longer implements it. Its primary use in the past was to detect whether or not the document was being rendered as XML rather than HTML. To detect this, you can create an element with its name in lower case, then check to see if it gets converted into all upper case (in which case the document is in the non-XML HTML mode):


```js
if (document.createElement("foo").tagName === "FOO") {
  /\* Document is not XML \*/
}
```

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

This feature is not part of any specification anymore. It is no more on track to become a standard.

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

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

Baseline 2022
-------------

Newly availableSince September 2022, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

* Learn more
* See full compatibility
* Report feedback
The `timeline` readonly property of the `Document` interface represents the default timeline of the current document. This timeline is a special instance of `DocumentTimeline`.

This timeline is unique to each `document` and persists for the lifetime of the `document` including calls to `Document.open()`.

 This timeline expresses the time in milliseconds since `Performance.timeOrigin`.
 Prior to the time origin, the timeline is inactive, and its `currentTime` is `null`.

**Note:** A document timeline that is associated with a non-active document (a `Document` not associated with a `Window`, `<iframe>`, or `<frame>`) is also considered to be inactive.

Value
-----

A `DocumentTimeline` object.

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

| Specification |
| --- |
| Web Animations # dom-document-timeline |

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

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

See also
--------

* Web Animations API
* `AnimationTimeline`
* `AnimationTimeline.currentTime`
* `DocumentTimeline`
Document: embeds property
=========================

 The **`embeds`** read-only property of the
 `Document` interface returns a list of the embedded
 `<embed>` elements within the current document.

Value
-----

An `HTMLCollection`.

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

| Specification |
| --- |
| HTML Standard # dom-document-embeds-dev |

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

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

 The **`Document.dir`** property is a string
 representing the directionality of the text of the document, whether left to right
 (default) or right to left. Possible values are `'rtl'`, right to left, and
 `'ltr'`, left to right.

Value
-----

A string.

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

| Specification |
| --- |
| HTML Standard # dom-document-dir |

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

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

See also
--------

* `dir` global
 attribute
Document: lastStyleSheetSet 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.

**Non-standard:** This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

 The **`Document.lastStyleSheetSet`** property returns the last enabled style sheet set. This property's
 value changes whenever the `document.selectedStyleSheetSet` property is
 changed.

Value
-----

The style sheet set that was most recently set. If the current style sheet set has not been changed by setting `document.selectedStyleSheetSet`, the returned value is `null`.

**Note:** This value doesn't change when
 `document.enableStyleSheetsForSet()` is called.


Examples
--------


```js
let lastSheetSet = document.lastStyleSheetSet;

if (!lastSheetSet) {
  lastSheetSet = "Style sheet not yet changed";
} else {
  console.log(`The last style sheet set is: ${lastSheetSet}`);
}
```

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

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

See also
--------

* `document.preferredStyleSheetSet`
* `document.selectedStyleSheetSet`
* `document.styleSheetSets`
* `document.enableStyleSheetsForSet()`
Document: cut event
===================

The **`cut`** event fires when the user initiates a cut action through the browser's user interface.

The original target for this event is the `Element` that was the intended target of the cut action. You can listen for this event on the `Document` interface to handle it in the capture or bubbling phases. For full details on this event please see the page on the Element: cut event.

Syntax
------

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


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

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

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

A `ClipboardEvent`. Inherits from `Event`.

Event

ClipboardEventExamples
--------

To be informed when a user cuts data from the webpage to their clipboard, you can add a handler to your `Document` instance using `addEventListener()`, like this:


```js
document.addEventListener("cut", (event) => {
  /\* the session has shut down \*/
});
```


Alternatively, you can use the `Document.oncut` event handler property to establish a handler for the `cut` event:


```js
document.oncut = (event) => {
  /\* the session has shut down \*/
};
```

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

| Specification |
| --- |
| Clipboard API and events # clipboard-event-cut |
| HTML Standard # handler-oncut |

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

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

See also
--------

* Related events: `copy`, `paste`
* This event on `Element` targets: `cut`
* This event on `Window` targets: `cut`
Document: anchors 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 **`anchors`** read-only property of the
 `Document` interface returns a list of all of the anchors in the document.

Value
-----

An `HTMLCollection`.

Examples
--------


```js
if (document.anchors.length >= 5) {
  dump("found too many anchors");
}
```


 The following is an example that auto populates a Table of Contents with every anchor
 on the page:


```html
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Test</title>
    <script>
 function init() {
 const toc = document.getElementById("toc");
 for (const anchor of document.anchors) {
 const li = document.createElement("li");
 const newAnchor = document.createElement("a");
 newAnchor.href = "#" + anchor.name;
 newAnchor.textContent = anchor.text;
 li.appendChild(newAnchor);
 toc.appendChild(li);
 }
 }
 </script>
  </head>
  <body onload="init()">
    <h1>Title</h1>
    <h2><a name="contents">Contents</a></h2>
    <ul id="toc"></ul>

    <h2><a name="plants">Plants</a></h2>
    <ol>
      <li>Apples</li>
      <li>Oranges</li>
      <li>Pears</li>
    </ol>

    <h2><a name="veggies">Veggies</a></h2>
    <ol>
      <li>Carrots</li>
      <li>Celery</li>
      <li>Beats</li>
    </ol>
  </body>
</html>
```


View on JSFiddle

Notes
-----

 For reasons of backwards compatibility, the returned set of anchors only contains those
 anchors created with the `name` attribute, not those created with the
 `id` attribute.

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

| Specification |
| --- |
| HTML Standard # dom-document-anchors |

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

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

The **`Document.currentScript`** property returns the `<script>` element whose script is currently being processed and isn't a JavaScript module. (For modules use `import.meta` instead.)

 It's important to note that this will not reference the `<script>`
 element if the code in the script is being called as a callback or event handler; it
 will only reference the element while it's initially being processed.

Value
-----

A `HTMLScriptElement` or null.

Examples
--------

This example checks to see if the script is being executed asynchronously:


```js
if (document.currentScript.async) {
  console.log("Executing asynchronously");
} else {
  console.log("Executing synchronously");
}
```


View Live Examples

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

| Specification |
| --- |
| HTML Standard # dom-document-currentscript-dev |

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

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

See also
--------

* `import.meta`
* `<script>`
* `document.afterscriptexecute_event`
* `document.beforescriptexecute_event`
Document: createAttributeNS() method
====================================

 The **`Document.createAttributeNS()`** method creates a new attribute node
 with the specified namespace URI and qualified name, and returns it.
 The object created is a node implementing the
 `Attr` interface. The DOM does not enforce what sort of attributes can be
 added to a particular element in this manner.

Syntax
------


```js
createAttributeNS(namespaceURI, qualifiedName)
```

### Parameters

`namespaceURI`

 A string that specifies the namespace URI to associate with the attribute.
 The `namespaceURI` property of the created attribute is initialized with the value of `namespaceURI`.
 See Valid Namespace URIs.


`qualifiedName`

 A string that specifies the name of attribute to be created.
 The `name` property of the created attribute is initialized with the value of `qualifiedName`.


### Return value

The new `Attr` node.

### Exceptions

`NamespaceError` `DOMException`

Thrown if the `namespaceURI` value is not a valid namespace URI.

`InvalidCharacterError` `DOMException`

Thrown if the `qualifiedName` value is not a valid XML name; for example, it starts with a number, hyphen, or period, or contains characters other than alphanumeric characters, underscores, hyphens, or periods.

Important Namespace URIs
------------------------

HTML

`http://www.w3.org/1999/xhtml`

SVG

`http://www.w3.org/2000/svg`

MathML

`http://www.w3.org/1998/Math/MathML`

Examples
--------


```js
const node = document.getElementById("svg");
const a = document.createAttributeNS("http://www.w3.org/2000/svg", "viewBox");
a.value = "0 0 100 100";
node.setAttributeNode(a);
console.log(node.getAttribute("viewBox")); // "0 0 100 100"
```

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

| Specification |
| --- |
| DOM Standard # dom-document-createattributens |

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

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

See also
--------

* `Document.createAttribute()`
* `Document.createElementNS()`
* `Element.setAttributeNS()`
* `Element.setAttributeNode()`
* `Element.setAttributeNodeNS()`