diff --git a/files/en-us/web/api/document/createattributens/index.md b/files/en-us/web/api/document/createattributens/index.md index c4287e1ff9499cc..ee1989f3fc2e824 100644 --- a/files/en-us/web/api/document/createattributens/index.md +++ b/files/en-us/web/api/document/createattributens/index.md @@ -23,13 +23,12 @@ createAttributeNS(namespaceURI, qualifiedName) - `namespaceURI` - : A string that specifies the {{DOMxRef("Attr.namespaceURI", "namespaceURI")}} to associate with the attribute, or the empty string. - Some important namespace URIs are: - - [HTML](/en-US/docs/Web/HTML) - - : `http://www.w3.org/1999/xhtml` - - [SVG](/en-US/docs/Web/SVG) - - : `http://www.w3.org/2000/svg` - - [MathML](/en-US/docs/Web/MathML) - - : `http://www.w3.org/1998/Math/MathML` + In HTML documents, most attributes are in the **null namespace** — use the empty string for these. + Use a specific namespace URI only when creating a namespaced attribute, such as `xml:lang` or `xml:space`. + Some namespace URIs are: + - XML: `http://www.w3.org/XML/1998/namespace` (for `xml:lang`, `xml:space`) + - XMLNS: `http://www.w3.org/2000/xmlns/` (for `xmlns`, `xmlns:*`) + - XLink: `http://www.w3.org/1999/xlink` (for `xlink:href`, `xlink:title`, etc.) - `qualifiedName` - : A string containing the qualified name of the new attribute. The {{DOMxRef("Attr.name", "name")}} property of the created attribute is initialized with this value. @@ -68,14 +67,46 @@ The new {{domxref("Attr")}} node. ## Examples -### Basic usage +### Creating a namespaced attribute + +This example creates an `xml:lang` attribute with the XML namespace and attaches it to a paragraph element. +This attribute specifies the language of the element's content for XML processing. + +```html +

Bonjour!

+``` + +```js +const el = document.getElementById("greeting"); +const attr = document.createAttributeNS( + "http://www.w3.org/XML/1998/namespace", + "xml:lang", +); +attr.value = "fr"; +el.setAttributeNode(attr); +``` + +### Creating an unprefixed attribute + +In HTML documents, unprefixed attributes (such as SVG presentation attributes like `viewBox`) are in the null namespace. +Use the empty string for the `namespaceURI` parameter to match this. + +```html + +``` + +```js +const svg = document.getElementById("svg"); +const attr = document.createAttributeNS("", "viewBox"); +attr.value = "0 0 100 100"; +svg.setAttributeNode(attr); +console.log(svg.getAttribute("viewBox")); // "0 0 100 100" +``` + +Note that, in most cases, you can use {{domxref("Element.setAttribute()")}} instead of `createAttributeNS()` for unprefixed attributes: ```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" +svg.setAttribute("viewBox", "0 0 100 100"); ``` ## Specifications diff --git a/files/en-us/web/api/window/index.md b/files/en-us/web/api/window/index.md index 8c344b67c89fd5f..4ce66ff7e2200f2 100644 --- a/files/en-us/web/api/window/index.md +++ b/files/en-us/web/api/window/index.md @@ -238,6 +238,8 @@ _This interface inherits methods from the {{domxref("EventTarget")}} interface._ - : Tells the browser that an animation is in progress, requesting that the browser schedule a repaint of the window for the next animation frame. - {{domxref("Window.requestIdleCallback()")}} - : Enables the scheduling of tasks during a browser's idle periods. +- {{domxref("Window.requestResize()")}} + - : Updates the size information shared by an embedded document with its embedding parent, but only if the embedded document has opted in to sharing its size information. - {{domxref("Window.resizeBy()")}} - : Resizes the current window by a certain amount. - {{domxref("Window.resizeTo()")}} diff --git a/files/en-us/web/api/window/requestresize/index.md b/files/en-us/web/api/window/requestresize/index.md new file mode 100644 index 000000000000000..81b48444486fd6a --- /dev/null +++ b/files/en-us/web/api/window/requestresize/index.md @@ -0,0 +1,136 @@ +--- +title: "Window: requestResize() method" +short-title: requestResize() +slug: Web/API/Window/requestResize +page-type: web-api-instance-method +browser-compat: api.Window.requestResize +--- + +{{APIRef}} + +The **`requestResize()`** method of the {{domxref("Window")}} interface updates the size information shared by an embedded document with its embedding parent, but only if the embedded document has opted in to sharing its size information via the [``](/en-US/docs/Web/HTML/Reference/Elements/meta/name/responsive-embedded-sizing) meta tag. + +## Syntax + +```js-nolint +requestResize() +``` + +### Parameters + +None. + +### Return value + +None ({{jsxref("undefined")}}). + +### Exceptions + +- `NotAllowedError` {{domxref("DOMException")}} + - : Thrown if: + - The `requestResize()` method was called from a top-level (non-embedded) document. + - The embedding element is not an {{htmlelement("iframe")}}. + - The embedded document has not opted in to sharing its layout size by including a [``](/en-US/docs/Web/HTML/Reference/Elements/meta/name/responsive-embedded-sizing) tag. + +> [!NOTE] +> If the parent document doesn't set the {{cssxref("frame-sizing")}} CSS property on the embedding ` +``` + +In the `index.html` CSS, we give the ` +``` + +In the `index.html` CSS, we give the `