diff --git a/files/en-us/web/api/document/fragmentdirective/index.md b/files/en-us/web/api/document/fragmentdirective/index.md index 92593ba004aa26b..bd8b85ce2b08dbf 100644 --- a/files/en-us/web/api/document/fragmentdirective/index.md +++ b/files/en-us/web/api/document/fragmentdirective/index.md @@ -16,15 +16,38 @@ A {{domxref("FragmentDirective")}} object. ## Examples -Try running the following in a supporting browser's devtools, in a tab with one or more matched text fragments: +### Checking if text fragments are supported + +The code below logs whether or not text fragments are supported in your browser by checking for existence of the object. +Note that the object is empty, and at present it is mainly intended for feature detection. +In the future, it might include other information. + +```html hidden +
+``` + +```js hidden +const logElement = document.querySelector("#log"); +function log(text) { + logElement.innerText = text; +} +``` + +```css hidden +#log { + height: 20px; +} +``` ```js -document.fragmentDirective; -// returns an empty FragmentDirective object, if supported -// undefined otherwise +if (document.fragmentDirective) { + log("Your browser supports text fragments."); +} else { + log("Text fragments are not supported in your browser."); +} ``` -This functionality is mainly intended for feature detection at present. In the future, the `FragmentDirective` object could include additional information. +{{EmbedLiveSample("Checking if text fragments are supported","100%","30px")}} ## Specifications diff --git a/files/en-us/web/api/fragmentdirective/index.md b/files/en-us/web/api/fragmentdirective/index.md index a67b6e180c7d8c2..c7e39486c69efcb 100644 --- a/files/en-us/web/api/fragmentdirective/index.md +++ b/files/en-us/web/api/fragmentdirective/index.md @@ -7,7 +7,7 @@ browser-compat: api.FragmentDirective {{APIRef("URL Fragment Text Directives")}} -The **`FragmentDirective`** interface is an object exposed for feature detectability, that is, whether or not a browser supports text fragments. +The **`FragmentDirective`** interface is an object exposed to allow code to check whether or not a browser supports text fragments. It is accessed via the {{domxref("Document.fragmentDirective")}} property. @@ -21,15 +21,38 @@ None. ## Examples -Try running the following in a supporting browser's devtools, in a tab with one or more matched text fragments: +### Checking if text fragments are supported + +The code below logs whether or not text fragments are supported in your browser by checking that {{domxref("Document.fragmentDirective")}} is defined. +Note that the object is empty, and at present is mainly intended for feature detection. +In the future, it might include other information. + +```html hidden + +``` + +```js hidden +const logElement = document.querySelector("#log"); +function log(text) { + logElement.innerText = text; +} +``` + +```css hidden +#log { + height: 20px; +} +``` ```js -document.fragmentDirective; -// returns an empty FragmentDirective object, if supported -// undefined otherwise +if (document.fragmentDirective) { + log("Your browser supports text fragments."); +} else { + log("Text fragments are not supported in your browser."); +} ``` -This functionality is mainly intended for feature detection at present. In the future, the `FragmentDirective` object could include additional information. +{{EmbedLiveSample("Checking if text fragments are supported","100%","30px")}} ## Specifications