chore(api): Make macros with line breaks span a single line only, 2 o…

…f 4 (#32582) * chore(api): Make macros with line breaks span a single line only, 2 of 4 * Apply suggestions from code review - just a few fixes to odd line breaks * Update files/en-us/web/api/element/id/index.md Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --------- Co-authored-by: Hamish Willee <[email protected]> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
mdn · Mar 11, 2024 · ce85e3f · ce85e3f
1 parent 8a9085b
commit ce85e3f
Show file tree

Hide file tree

Showing 54 changed files with 87 additions and 141 deletions.
diff --git a/files/en-us/web/api/dompoint/frompoint_static/index.md b/files/en-us/web/api/dompoint/frompoint_static/index.md
@@ -60,9 +60,8 @@ const mutablePoint = DOMPoint.fromPoint(readOnlyPoint);
 ### Creating a 2D point
 
 This sample creates a 2D point, specifying an inline object that includes the values to
-use for {{domxref("DOMPointReadOnly.x", "x")}} and {{domxref("DOMPointReadOnly.y",
-  "y")}}. The _z_ and _w_ properties are allowed to keep their default
-values (0 and 1 respectively).
+use for {{domxref("DOMPointReadOnly.x", "x")}} and {{domxref("DOMPointReadOnly.y", "y")}}.
+The _z_ and _w_ properties are allowed to keep their default values (0 and 1 respectively).
 
 ```js
 const center = DOMPoint.fromPoint({ x: 75, y: -50, z: -55, w: 0.25 });

diff --git a/files/en-us/web/api/dompoint/w/index.md b/files/en-us/web/api/dompoint/w/index.md
@@ -16,8 +16,8 @@ point in space.
 
 A double-precision floating-point value indicating the _w_ perspective value for
 the point. This value is **unrestricted**, meaning that it is allowed to be
-infinite or invalid (that is, its value may be {{jsxref("NaN")}} or {{jsxref("Infinity",
-  "±Infinity")}}). The default is 1.0.
+infinite or invalid (that is, its value may be {{jsxref("NaN")}} or {{jsxref("Infinity", "±Infinity")}}).
+The default is 1.0.
 
 ## Specifications
 

diff --git a/files/en-us/web/api/dompoint/x/index.md b/files/en-us/web/api/dompoint/x/index.md
@@ -20,8 +20,7 @@ have altered the orientation of the axes.
 
 A double-precision floating-point value indicating the x coordinate's value for the
 point. This value is **unrestricted**, meaning that it is allowed to be
-infinite or invalid (that is, its value may be {{jsxref("NaN")}} or {{jsxref("Infinity",
-  "±Infinity")}}).
+infinite or invalid (that is, its value may be {{jsxref("NaN")}} or {{jsxref("Infinity", "±Infinity")}}).
 
 ## Specifications
 
@@ -34,5 +33,4 @@ infinite or invalid (that is, its value may be {{jsxref("NaN")}} or {{jsxref("In
 ## See also
 
 - The other coordinate properties: {{domxref("DOMPoint.y", "y")}},
-  {{domxref("DOMPoint.z", "z")}}, and the perspective value, {{domxref("DOMPoint.w",
-    "w")}}.
+  {{domxref("DOMPoint.z", "z")}}, and the perspective value, {{domxref("DOMPoint.w", "w")}}.
diff --git a/files/en-us/web/api/dompoint/y/index.md b/files/en-us/web/api/dompoint/y/index.md
@@ -33,5 +33,4 @@ to be infinite or invalid (that is, its value may be {{jsxref("NaN")}} or
 ## See also
 
 - The other coordinate properties: {{domxref("DOMPoint.x", "x")}},
-  {{domxref("DOMPoint.z", "z")}}, and the perspective value, {{domxref("DOMPoint.w",
-    "w")}}.
+  {{domxref("DOMPoint.z", "z")}}, and the perspective value, {{domxref("DOMPoint.w", "w")}}.
diff --git a/files/en-us/web/api/dompoint/z/index.md b/files/en-us/web/api/dompoint/z/index.md
@@ -34,5 +34,4 @@ to be infinite or invalid (that is, its value may be {{jsxref("NaN")}} or
 ## See also
 
 - The other coordinate properties: {{domxref("DOMPoint.x", "x")}},
-  {{domxref("DOMPoint.y", "y")}}, and the perspective value, {{domxref("DOMPoint.w",
-    "w")}}.
+  {{domxref("DOMPoint.y", "y")}}, and the perspective value, {{domxref("DOMPoint.w", "w")}}.
diff --git a/files/en-us/web/api/dompointreadonly/frompoint_static/index.md b/files/en-us/web/api/dompointreadonly/frompoint_static/index.md
@@ -46,8 +46,8 @@ A new {{domxref("DOMPointReadOnly")}} object (which is identical to the source p
 ### Creating a 2D point
 
 This sample creates a 2D point, specifying an inline object that includes the values to
-use for {{domxref("DOMPointReadOnly.x", "x")}} and {{domxref("DOMPointReadOnly.y",
-  "y")}}. The `z` and `w` properties are allowed to keep their
+use for {{domxref("DOMPointReadOnly.x", "x")}} and {{domxref("DOMPointReadOnly.y", "y")}}.
+The `z` and `w` properties are allowed to keep their
 default values (`0` and `1` respectively).
 
 ```js

diff --git a/files/en-us/web/api/dompointreadonly/x/index.md b/files/en-us/web/api/dompointreadonly/x/index.md
@@ -20,8 +20,7 @@ In general, positive values `x` mean to the right, and negative values of
 
 A double-precision floating-point value indicating the x coordinate's value for the
 point. This value is **unrestricted**, meaning that it is allowed to be
-infinite or invalid (that is, its value may be {{jsxref("NaN")}} or {{jsxref("Infinity",
-  "±Infinity")}}).
+infinite or invalid (that is, its value may be {{jsxref("NaN")}} or {{jsxref("Infinity", "±Infinity")}}).
 
 ## Specifications
 

diff --git a/files/en-us/web/api/dompointreadonly/y/index.md b/files/en-us/web/api/dompointreadonly/y/index.md
@@ -22,8 +22,7 @@ In general, positive values of `y` mean downward, and negative values of
 
 A double-precision floating-point value indicating the y coordinate's value for the
 point. This value is **unrestricted**, meaning that it is allowed to be
-infinite or invalid (that is, its value may be {{jsxref("NaN")}} or {{jsxref("Infinity",
-  "±Infinity")}}).
+infinite or invalid (that is, its value may be {{jsxref("NaN")}} or {{jsxref("Infinity", "±Infinity")}}).
 
 ## Specifications
 

diff --git a/files/en-us/web/api/dompointreadonly/z/index.md b/files/en-us/web/api/dompointreadonly/z/index.md
@@ -23,8 +23,7 @@ screen), assuming no transforms have resulted in a reversal.
 
 A double-precision floating-point value indicating the z coordinate's value for the
 point. This value is **unrestricted**, meaning that it is allowed to be
-infinite or invalid (that is, its value may be {{jsxref("NaN")}} or {{jsxref("Infinity",
-  "±Infinity")}}).
+infinite or invalid (that is, its value may be {{jsxref("NaN")}} or {{jsxref("Infinity", "±Infinity")}}).
 
 ## Specifications
 

diff --git a/files/en-us/web/api/element/id/index.md b/files/en-us/web/api/element/id/index.md
@@ -15,10 +15,8 @@ global attribute.
 
 If the `id` value is not the empty string, it must be unique in a document.
 
-The `id` is often used with {{domxref("Document.getElementById()",
-  "getElementById()")}} to retrieve a particular element. Another common case is to use an
-element's [ID as a selector](/en-US/docs/Web/CSS/ID_selectors) when styling
-the document with [CSS](/en-US/docs/Web/CSS).
+The `id` is often used with {{domxref("Document.getElementById()", "getElementById()")}} to retrieve a particular element.
+Another common case is to use an element's [ID as a selector](/en-US/docs/Web/CSS/ID_selectors) when styling the document with [CSS](/en-US/docs/Web/CSS).
 
 > **Note:** Identifiers are case-sensitive, but you should avoid creating
 > IDs that differ only in the capitalization.

diff --git a/files/en-us/web/api/element/scrollheight/index.md b/files/en-us/web/api/element/scrollheight/index.md
@@ -16,8 +16,8 @@ screen due to overflow.
 
 The `scrollHeight` value is equal to the minimum height the element would
 require in order to fit all the content in the viewport without using a vertical
-scrollbar. The height is measured in the same way as {{domxref("Element.clientHeight",
-  "clientHeight")}}: it includes the element's padding, but not its border, margin or
+scrollbar. The height is measured in the same way as {{domxref("Element.clientHeight", "clientHeight")}}:
+it includes the element's padding, but not its border, margin or
 horizontal scrollbar (if present). It can also include the height of pseudo-elements
 such as {{cssxref("::before")}} or {{cssxref("::after")}}. If the element's content can
 fit without a need for vertical scrollbar, its `scrollHeight` is equal to

diff --git a/files/en-us/web/api/element/scrollwidth/index.md b/files/en-us/web/api/element/scrollwidth/index.md
@@ -14,8 +14,8 @@ screen due to overflow.
 
 The `scrollWidth` value is equal to the minimum width the element would
 require in order to fit all the content in the viewport without using a horizontal
-scrollbar. The width is measured in the same way as {{domxref("Element.clientWidth",
-  "clientWidth")}}: it includes the element's padding, but not its border, margin or
+scrollbar. The width is measured in the same way as {{domxref("Element.clientWidth", "clientWidth")}}:
+it includes the element's padding, but not its border, margin or
 vertical scrollbar (if present). It can also include the width of pseudo-elements such
 as {{cssxref("::before")}} or {{cssxref("::after")}}. If the element's content can fit
 without a need for horizontal scrollbar, its `scrollWidth` is equal to

diff --git a/files/en-us/web/api/element/setcapture/index.md b/files/en-us/web/api/element/setcapture/index.md
@@ -12,8 +12,7 @@ browser-compat: api.Element.setCapture
 {{Deprecated_Header}}{{non-standard_header}}{{ APIRef("DOM") }}
 
 Call this method during the handling of a mousedown event to retarget all mouse events
-to this element until the mouse button is released or {{
-  domxref("document.releaseCapture()") }} is called.
+to this element until the mouse button is released or {{domxref("document.releaseCapture()")}} is called.
 
 > **Warning:** This interface never had much cross-browser
 > support and you probably looking for {{domxref("element.setPointerCapture")}} instead,

diff --git a/files/en-us/web/api/event/cancelable/index.md b/files/en-us/web/api/event/cancelable/index.md
@@ -29,8 +29,7 @@ method on the event. This keeps the implementation from executing the default ac
 that is associated with the event.
 
 Event listeners that handle multiple kinds of events may want to check
-`cancelable` before invoking their {{domxref("event.preventDefault",
-  "preventDefault()")}} methods.
+`cancelable` before invoking their {{domxref("event.preventDefault", "preventDefault()")}} methods.
 
 ## Value
 
@@ -39,9 +38,7 @@ canceled.
 
 ## Example
 
-For example, browser vendors are proposing that the {{domxref("Element/wheel_event",
-  "wheel")}} event can only be canceled [the first time the listener is called](https://github.com/WICG/interventions/issues/33) — any following `wheel` events cannot be
-canceled.
+For example, browser vendors are proposing that the {{domxref("Element/wheel_event", "wheel")}} event can only be canceled [the first time the listener is called](https://github.com/WICG/interventions/issues/33) — any following `wheel` events cannot be canceled.
 
 ```js
 function preventScrollWheel(event) {

diff --git a/files/en-us/web/api/event/eventphase/index.md b/files/en-us/web/api/event/eventphase/index.md
@@ -29,8 +29,7 @@ flow. Possible values are:
     called are triggered during this phase.
 - `Event.AT_TARGET (2)`
   - : The event has arrived at
-    {{domxref("EventTarget", "the event's target", "",
-        1)}}.
+    {{domxref("EventTarget", "the event's target", "", 1)}}.
     Event listeners registered for this phase are called at this time. If
     {{domxref("Event.bubbles")}} is `false`, processing
     the event is finished after this phase is complete.

diff --git a/files/en-us/web/api/eventtarget/addeventlistener/index.md b/files/en-us/web/api/eventtarget/addeventlistener/index.md
@@ -230,11 +230,7 @@ my_element.addEventListener("click", (e) => {
 });
 ```
 
-If an event handler (for example, {{domxref("Element.click_event",
-  "onclick")}}) is specified on an element in the HTML source, the JavaScript code in the
-attribute value is effectively wrapped in a handler function that binds the value of
-`this` in a manner consistent with the `addEventListener()`; an
-occurrence of `this` within the code represents a reference to the element.
+If an event handler (for example, {{domxref("Element.click_event", "onclick")}}) is specified on an element in the HTML source, the JavaScript code in the attribute value is effectively wrapped in a handler function that binds the value of `this` in a manner consistent with the `addEventListener()`; an occurrence of `this` within the code represents a reference to the element.
 
 ```html
 <table id="my_table" onclick="console.log(this.id);">

diff --git a/files/en-us/web/api/featurepolicy/allowedfeatures/index.md b/files/en-us/web/api/featurepolicy/allowedfeatures/index.md
@@ -14,8 +14,7 @@ The **`allowedFeatures()`** method of
 the {{DOMxRef("FeaturePolicy")}} interface returns a list of directive names of all
 features allowed by the [Permissions Policy](/en-US/docs/Web/HTTP/Permissions_Policy). This enables introspection of individual directives
 of the Permissions Policy it is run on. As such, `allowedFeatures()` method
-returns a subset of directives returned by {{DOMxRef("FeaturePolicy.features",
-    "features()")}}.
+returns a subset of directives returned by {{DOMxRef("FeaturePolicy.features", "features()")}}.
 
 ## Syntax
 

diff --git a/files/en-us/web/api/fetchevent/respondwith/index.md b/files/en-us/web/api/fetchevent/respondwith/index.md
@@ -16,15 +16,15 @@ In most cases you can provide any response that the receiver understands. For ex
 if an {{HTMLElement('img')}} initiates the request, the response body needs to be
 image data. For security reasons, there are a few global rules:
 
-- You can only return {{domxref("Response")}} objects of {{domxref("Response.type",
-  "type")}} "`opaque`" if the {{domxref("fetchEvent.request")}} object's
+- You can only return {{domxref("Response")}} objects of {{domxref("Response.type", "type")}}
+  "`opaque`" if the {{domxref("fetchEvent.request")}} object's
   {{domxref("request.mode", "mode")}} is "`no-cors`". This prevents the
   leaking of private data.
-- You can only return {{domxref("Response")}} objects of {{domxref("Response.type",
-  "type")}} "`opaqueredirect`" if the {{domxref("fetchEvent.request")}}
+- You can only return {{domxref("Response")}} objects of {{domxref("Response.type", "type")}}
+  "`opaqueredirect`" if the {{domxref("fetchEvent.request")}}
   object's {{domxref("request.mode", "mode")}} is "`manual`".
-- You cannot return {{domxref("Response")}} objects of {{domxref("Response.type",
-  "type")}} "`cors`" if the {{domxref("fetchEvent.request")}} object's
+- You cannot return {{domxref("Response")}} objects of {{domxref("Response.type", "type")}}
+  "`cors`" if the {{domxref("fetchEvent.request")}} object's
   {{domxref("request.mode", "mode")}} is "`same-origin`".
 
 ### Specifying the final URL of a resource

diff --git a/files/en-us/web/api/filereader/result/index.md b/files/en-us/web/api/filereader/result/index.md
@@ -35,8 +35,7 @@ The result types are described below.
       </td>
       <td>
         The <code>result</code> is a JavaScript
-        {{jsxref("Global_Objects/ArrayBuffer",
-        "ArrayBuffer")}}
+        {{jsxref("Global_Objects/ArrayBuffer", "ArrayBuffer")}}
         containing binary data.
       </td>
     </tr>

diff --git a/files/en-us/web/api/filesystemdirectoryentry/createreader/index.md b/files/en-us/web/api/filesystemdirectoryentry/createreader/index.md
@@ -60,8 +60,8 @@ function readDirectory(directory) {
 
 This works by creating an internal function, `getEntries()`, which calls
 itself recursively to get all the entries in the directory, concatenating each batch to
-the array. Each iteration, {{domxref("FileSystemDirectoryReader.readEntries",
-  "readEntries()")}} is called to get more entries. When it returns an empty array, the
+the array. Each iteration, {{domxref("FileSystemDirectoryReader.readEntries", "readEntries()")}}
+is called to get more entries. When it returns an empty array, the
 end of the directory has been reached, and the recursion ends. Once control is returned
 to `readDirectory()`, the array is returned to the caller.
 

diff --git a/files/en-us/web/api/filesystementry/name/index.md b/files/en-us/web/api/filesystementry/name/index.md
@@ -11,8 +11,7 @@ browser-compat: api.FileSystemEntry.name
 The read-only **`name`** property of
 the {{domxref("FileSystemEntry")}} interface returns a string
 specifying the entry's name; this is the entry within its parent directory (the last
-component of the path as indicated by the {{domxref("FileSystemEntry.fullPath",
-    "fullPath")}} property).
+component of the path as indicated by the {{domxref("FileSystemEntry.fullPath", "fullPath")}} property).
 
 ## Value
 

diff --git a/files/en-us/web/api/filesystemhandle/issameentry/index.md b/files/en-us/web/api/filesystemhandle/issameentry/index.md
@@ -9,8 +9,7 @@ browser-compat: api.FileSystemHandle.isSameEntry
 {{securecontext_header}}{{APIRef("File System API")}}
 
 The **`isSameEntry()`** method of the
-{{domxref("FileSystemHandle")}} interface compares two {{domxref("FileSystemHandle",
-  "handles")}} to see if the associated entries (either a file or directory) match.
+{{domxref("FileSystemHandle")}} interface compares two {{domxref("FileSystemHandle", "handles")}} to see if the associated entries (either a file or directory) match.
 
 ## Syntax
 

diff --git a/files/en-us/web/api/focusevent/focusevent/index.md b/files/en-us/web/api/focusevent/focusevent/index.md
@@ -23,8 +23,7 @@ new FocusEvent(type, options)
 ### Parameters
 
 _The `FocusEvent()` constructor also inherits arguments from
-{{domxref("UIEvent.UIEvent", "UIEvent()")}} and from {{domxref("Event.Event",
-    "Event()")}}._
+{{domxref("UIEvent.UIEvent", "UIEvent()")}} and from {{domxref("Event.Event", "Event()")}}._
 
 - `type`
   - : A string with the name of the event.

diff --git a/files/en-us/web/api/gamepad/buttons/index.md b/files/en-us/web/api/gamepad/buttons/index.md
@@ -8,8 +8,7 @@ browser-compat: api.Gamepad.buttons
 
 {{APIRef("Gamepad API")}}{{SecureContext_Header}}
 
-The **`Gamepad.buttons`** property of the {{domxref("Gamepad")
-  }} interface returns an array of {{domxref("gamepadButton")}} objects representing the
+The **`Gamepad.buttons`** property of the {{domxref("Gamepad")}} interface returns an array of {{domxref("gamepadButton")}} objects representing the
 buttons present on the device.
 
 Each entry in the array is 0 if the button is not pressed, and non-zero (typically 1.0)

diff --git a/files/en-us/web/api/history/go/index.md b/files/en-us/web/api/history/go/index.md
@@ -42,8 +42,7 @@ None ({{jsxref("undefined")}}).
 
 ## Examples
 
-To move back one page (the equivalent of calling {{domxref("History.back",
-  "back()")}}):
+To move back one page (the equivalent of calling {{domxref("History.back", "back()")}}):
 
 ```js
 history.go(-1);

diff --git a/files/en-us/web/api/htmlaudioelement/audio/index.md b/files/en-us/web/api/htmlaudioelement/audio/index.md
@@ -55,8 +55,8 @@ playback to begin:
 - Listen for the {{domxref("HTMLMediaElement.canplay_event", "canplay")}} event. It
   is sent to the `<audio>` element when there's enough audio
   available to begin playback, although interruptions may occur.
-- Listen for the {{domxref("HTMLMediaElement.canplaythrough_event",
-  "canplaythrough")}} event. It is sent when it's estimated that the audio should be
+- Listen for the {{domxref("HTMLMediaElement.canplaythrough_event", "canplaythrough")}} event.
+  It is sent when it's estimated that the audio should be
   able to play to the end without interruption.
 
 The event-based approach is best:

diff --git a/files/en-us/web/api/htmlelement/dataset/index.md b/files/en-us/web/api/htmlelement/dataset/index.md
@@ -38,8 +38,8 @@ attributes in our article [_Using data attributes_](/en-US/docs/Learn/HTML/Howto
 
 - `dash-style` to `camelCase` conversion
 
-  - : A custom data attribute name is transformed to a key for the {{
-      domxref("DOMStringMap") }} entry by the following:
+  - : A custom data attribute name is transformed to a key for the
+    {{domxref("DOMStringMap") }} entry by the following:
 
     1. Lowercase all ASCII capital letters (`A` to
        `Z`);

diff --git a/files/en-us/web/api/htmlimageelement/crossorigin/index.md b/files/en-us/web/api/htmlimageelement/crossorigin/index.md
@@ -22,9 +22,9 @@ without CORS (the fetch `no-cors` mode).
 Permitted values are:
 
 - `anonymous`
-  - : Requests by the {{HTMLElement("img")}} element have their {{domxref("Request.mode",
-    "mode")}} set to `cors` and their {{domxref("Request.credentials",
-    "credentials")}} mode set to `same-origin`. This means that CORS is enabled
+  - : Requests by the {{HTMLElement("img")}} element have their
+    {{domxref("Request.mode", "mode")}} set to `cors` and their {{domxref("Request.credentials", "credentials")}}
+    mode set to `same-origin`. This means that CORS is enabled
     and credentials are sent _if_ the image is fetched from the same origin from
     which the document was loaded.
 - `use-credentials`

diff --git a/files/en-us/web/api/htmlimageelement/image/index.md b/files/en-us/web/api/htmlimageelement/image/index.md
@@ -10,8 +10,7 @@ browser-compat: api.HTMLImageElement.Image
 
 The **`Image()`**
 constructor creates a new {{DOMxRef("HTMLImageElement")}} instance. It is functionally
-equivalent to {{DOMxRef("Document.createElement()",
-    "document.createElement('img')")}}.
+equivalent to {{DOMxRef("Document.createElement()", "document.createElement('img')")}}.
 
 > **Note:** This function should not be confused with the CSS [`image()`](/en-US/docs/Web/CSS/image/image) function.
 

diff --git a/files/en-us/web/api/htmlimageelement/naturalheight/index.md b/files/en-us/web/api/htmlimageelement/naturalheight/index.md
@@ -28,8 +28,7 @@ image height, it will be rendered this tall.
 An integer value indicating the intrinsic height, in CSS pixels, of the image. This is
 the height at which the image is naturally drawn when no constraint or specific value is
 established for the image. This natural height is corrected for the pixel density of the
-device on which it's being presented, unlike {{domxref("HTMLImageElement.height",
-  "height")}}.
+device on which it's being presented, unlike {{domxref("HTMLImageElement.height", "height")}}.
 
 If the intrinsic height is not available—either because the image does not specify an
 intrinsic height or because the image data is not available in order to obtain this

diff --git a/files/en-us/web/api/htmlimageelement/naturalwidth/index.md b/files/en-us/web/api/htmlimageelement/naturalwidth/index.md
@@ -10,8 +10,7 @@ browser-compat: api.HTMLImageElement.naturalWidth
 
 The {{domxref("HTMLImageElement")}} interface's read-only
 **`naturalWidth`** property returns the intrinsic (natural),
-density-corrected width of the image in {{Glossary("CSS pixel", "CSS
-    pixels")}}.
+density-corrected width of the image in {{Glossary("CSS pixel", "CSS pixels")}}.
 
 This is the width the image is if drawn with nothing constraining
 its width; if you neither specify a width for the image nor place the image inside a

diff --git a/files/en-us/web/api/htmlimageelement/sizes/index.md b/files/en-us/web/api/htmlimageelement/sizes/index.md
@@ -126,9 +126,8 @@ article img {
 #### JavaScript
 
 The JavaScript code handles the two buttons that let you toggle the third width option
-between 40em and 50em; this is done by handling the {{domxref("Element.click_event",
-  "click")}} event, using the JavaScript string object {{jsxref("String.replace",
-  "replace()")}} method to replace the relevant portion of the `sizes` string.
+between 40em and 50em; this is done by handling the {{domxref("Element.click_event", "click")}}
+event, using the JavaScript string object {{jsxref("String.replace", "replace()")}} method to replace the relevant portion of the `sizes` string.
 
 ```js
 const image = document.querySelector("article img");