Demix ChildNode.remove to Element, CharacterData, DocumentType (#5088)

* Demix ChildNode.remove to Element, CharacterData, DocumentType * Address feedback
mdn · May 21, 2021 · c198b05 · c198b05
1 parent 231c1bf
commit c198b05
Show file tree

Hide file tree

Showing 11 changed files with 174 additions and 69 deletions.
diff --git a/files/en-us/_redirects.txt b/files/en-us/_redirects.txt
@@ -7143,9 +7143,9 @@
 /en-US/docs/Web/API/CharacterData.previousElementSibling	/en-US/docs/Web/API/Element/previousElementSibling
 /en-US/docs/Web/API/CharacterData/nextElementSibling	/en-US/docs/Web/API/Element/nextElementSibling
 /en-US/docs/Web/API/CharacterData/previousElementSibling	/en-US/docs/Web/API/Element/previousElementSibling
-/en-US/docs/Web/API/CharacterData/remove	/en-US/docs/Web/API/ChildNode/remove
 /en-US/docs/Web/API/ChildNode.nextElementSibling	/en-US/docs/Web/API/Element/nextElementSibling
-/en-US/docs/Web/API/ChildNode.remove	/en-US/docs/Web/API/ChildNode/remove
+/en-US/docs/Web/API/ChildNode.remove	/en-US/docs/Web/API/Element/remove
+/en-US/docs/Web/API/ChildNode/remove	/en-US/docs/Web/API/Element/remove
 /en-US/docs/Web/API/Childnode.previousElementSibling	/en-US/docs/Web/API/Element/previousElementSibling
 /en-US/docs/Web/API/Client/focus	/en-US/docs/Web/API/WindowClient/focus
 /en-US/docs/Web/API/Client/focused	/en-US/docs/Web/API/WindowClient/focused
@@ -7336,7 +7336,6 @@
 /en-US/docs/Web/API/DocumentTouch.createTouchList	/en-US/docs/Web/API/Document/createTouchList
 /en-US/docs/Web/API/DocumentTouch/createTouch	/en-US/docs/Web/API/Document/createTouch
 /en-US/docs/Web/API/DocumentTouch/createTouchList	/en-US/docs/Web/API/Document/createTouchList
-/en-US/docs/Web/API/DocumentType/remove	/en-US/docs/Web/API/ChildNode/remove
 /en-US/docs/Web/API/Document_Object_Model/Events	/en-US/docs/Learn/JavaScript/Building_blocks/Events
 /en-US/docs/Web/API/Document_Object_Model/Preface	/en-US/docs/Web/API/Document_Object_Model
 /en-US/docs/Web/API/Document_Object_Model/Whitespace_in_the_DOM	/en-US/docs/Web/API/Document_Object_Model/Whitespace
@@ -7404,7 +7403,6 @@
 /en-US/docs/Web/API/Element/pointerout_event	/en-US/docs/Web/API/HTMLElement/pointerout_event
 /en-US/docs/Web/API/Element/pointerover_event	/en-US/docs/Web/API/HTMLElement/pointerover_event
 /en-US/docs/Web/API/Element/pointerup_event	/en-US/docs/Web/API/HTMLElement/pointerup_event
-/en-US/docs/Web/API/Element/remove	/en-US/docs/Web/API/ChildNode/remove
 /en-US/docs/Web/API/Element/resourcetimingbufferfull_event	/en-US/docs/Web/API/Performance/resourcetimingbufferfull_event
 /en-US/docs/Web/API/ElementTraversal.childElementCount	/en-US/docs/Web/API/Element/childElementCount
 /en-US/docs/Web/API/ElementTraversal.firstElementChild	/en-US/docs/Web/API/Element/firstElementChild

diff --git a/files/en-us/_wikihistory.json b/files/en-us/_wikihistory.json
@@ -34351,42 +34351,6 @@
       "jpmedley"
     ]
   },
-  "Web/API/ChildNode/remove": {
-    "modified": "2020-10-15T21:24:21.823Z",
-    "contributors": [
-      "jm5764946",
-      "hcoronado",
-      "stevenvachon",
-      "mauskin",
-      "joedf",
-      "HawkeyePierce89",
-      "mfuji09",
-      "mfluehr",
-      "fscholz",
-      "erikadoyle",
-      "Tobie",
-      "chrisdavidmills",
-      "jacott",
-      "DomenicDenicola",
-      "stevenwdv",
-      "jszhou",
-      "arronei",
-      "jpmedley",
-      "theotherdell",
-      "huupoke12",
-      "jkbockstael",
-      "pepri",
-      "valtlait1",
-      "cvrebert",
-      "shgysk8zer0",
-      "paul.irish",
-      "teoli",
-      "ziyunfei",
-      "jyasskin",
-      "elisee",
-      "tregagnon"
-    ]
-  },
   "Web/API/ChildNode/replaceWith": {
     "modified": "2020-10-15T21:47:15.895Z",
     "contributors": [
@@ -44209,6 +44173,42 @@
       "AFBarstow"
     ]
   },
+  "Web/API/Element/remove": {
+    "modified": "2020-10-15T21:24:21.823Z",
+    "contributors": [
+      "jm5764946",
+      "hcoronado",
+      "stevenvachon",
+      "mauskin",
+      "joedf",
+      "HawkeyePierce89",
+      "mfuji09",
+      "mfluehr",
+      "fscholz",
+      "erikadoyle",
+      "Tobie",
+      "chrisdavidmills",
+      "jacott",
+      "DomenicDenicola",
+      "stevenwdv",
+      "jszhou",
+      "arronei",
+      "jpmedley",
+      "theotherdell",
+      "huupoke12",
+      "jkbockstael",
+      "pepri",
+      "valtlait1",
+      "cvrebert",
+      "shgysk8zer0",
+      "paul.irish",
+      "teoli",
+      "ziyunfei",
+      "jyasskin",
+      "elisee",
+      "tregagnon"
+    ]
+  },
   "Web/API/Element/removeAttribute": {
     "modified": "2020-10-15T21:14:33.422Z",
     "contributors": [

diff --git a/files/en-us/learn/javascript/client-side_web_apis/manipulating_documents/index.html b/files/en-us/learn/javascript/client-side_web_apis/manipulating_documents/index.html
@@ -161,7 +161,7 @@ <h3 id="Moving_and_removing_elements">Moving and removing elements</h3>
 
 <pre class="brush: js">sect.removeChild(linkPara);</pre>
 
-<p>When you want to remove a node based only on a reference to itself, which is fairly common, you can use {{domxref("ChildNode.remove()")}}:</p>
+<p>When you want to remove a node based only on a reference to itself, which is fairly common, you can use {{domxref("Element.remove()")}}:</p>
 
 <pre class="brush: js">linkPara.remove();</pre>
 

diff --git a/files/en-us/web/api/characterdata/index.html b/files/en-us/web/api/characterdata/index.html
@@ -39,7 +39,7 @@ <h2 id="Methods">Methods</h2>
  <dd>Removes the specified amount of characters, starting at the specified offset, from the <code>CharacterData.data</code> string; when this method returns, <code>data</code> contains the shortened {{domxref("DOMString")}}.</dd>
  <dt>{{domxref("CharacterData.insertData()")}}</dt>
  <dd>Inserts the specified characters, at the specified offset, in the <code>CharacterData.data</code> string; when this method returns, <code>data</code> contains the modified {{domxref("DOMString")}}.</dd>
- <dt>{{domxref("ChildNode.remove()")}} {{experimental_inline}}</dt>
+ <dt>{{domxref("CharacterData.remove()")}}</dt>
  <dd>Removes the object from its parent children list.</dd>
  <dt>{{domxref("CharacterData.replaceData()")}}</dt>
  <dd>Replaces the specified amount of characters, starting at the specified offset, with the specified {{domxref("DOMString")}}; when this method returns, <code>data</code> contains the modified {{domxref("DOMString")}}.</dd>

diff --git a/files/en-us/web/api/characterdata/remove/index.html b/files/en-us/web/api/characterdata/remove/index.html
@@ -0,0 +1,57 @@
+---
+title: CharacterData.remove()
+slug: Web/API/CharacterData/remove
+tags:
+  - API
+  - CharacterData
+  - DOM
+  - Method
+---
+<div>{{APIRef("DOM")}}</div>
+
+<p>The <code><strong>CharacterData.remove()</strong></code> method removes text.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="brush: js">remove()</pre>
+
+<h2 id="Examples">Examples</h2>
+
+<h3 id="Using_remove">Using <code>remove()</code></h3>
+
+<pre class="brush: html">
+&lt;p id="myText"&gt;Some text&lt;/p&gt;
+</pre>
+
+<pre class="brush: js">let text = document.getElementById('myText').firstChild;
+text.remove(); // Removes the text
+</pre>
+
+<pre class="brush: html">
+&lt;p id="myText"&gt;&lt;/p&gt;
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+  <thead>
+    <tr>
+      <th scope="col">Specification</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>{{SpecName('DOM WHATWG', '#dom-childnode-remove', 'ChildNode.remove')}}</td>
+    </tr>
+  </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{Compat("api.CharacterData.remove")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+  <li>{{domxref("Element.remove()")}}</li>
+</ul>
diff --git a/files/en-us/web/api/documenttype/index.html b/files/en-us/web/api/documenttype/index.html
@@ -34,10 +34,10 @@ <h2 id="Properties">Properties</h2>
 
 <h2 id="Methods">Methods</h2>
 
-<p><em>Inherits methods from its parent, {{domxref("Node")}}, and implements the {{domxref("ChildNode")}} interface.</em></p>
+<p><em>Inherits methods from its parent, {{domxref("Node")}}.</em></p>
 
 <dl>
-	<dt>{{domxref("ChildNode.remove()")}} {{experimental_inline}}</dt>
+	<dt>{{domxref("DocumentType.remove()")}}</dt>
 	<dd>Removes the object from its parent children list.</dd>
 </dl>
 

diff --git a/files/en-us/web/api/documenttype/remove/index.html b/files/en-us/web/api/documenttype/remove/index.html
@@ -0,0 +1,61 @@
+---
+title: DocumentType.remove()
+slug: Web/API/DocumentType/remove
+tags:
+  - API
+  - DocumentType
+  - DOM
+  - Method
+---
+<div>{{APIRef("DOM")}}</div>
+
+<p>The <code><strong>DocumentType.remove()</strong></code> method removes a document's <code>doctype</code>.</p>
+
+<div class="note">
+  <h4>Note</h4>
+  <p>Removing the document's doctype will set the rendering mode to
+    <a href="/en-US/docs/Web/HTML/Quirks_Mode_and_Standards_Mode">quirks mode</a>!
+    Please don’t do this. Willfully designing for quirks mode is not going to help you.
+    If you need to work around issues with old Internet Explorer browsers, you might want to look into using
+    <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/HTML_and_CSS#ie_conditional_comments">conditional comments</a>, or other workarounds.</p>
+</div>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="brush: js">remove()</pre>
+
+<h2 id="Examples">Examples</h2>
+
+<h3 id="Using_remove">Using <code>remove()</code></h3>
+
+<pre class="brush: js">
+document.doctype; // "&lt;!DOCTYPE html&gt;'
+document.doctype.remove();
+document.doctype; // null
+</pre>
+
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+  <thead>
+    <tr>
+      <th scope="col">Specification</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>{{SpecName('DOM WHATWG', '#dom-childnode-remove', 'ChildNode.remove')}}</td>
+    </tr>
+  </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{Compat("api.DocumentType.remove")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+  <li>{{domxref("Document.doctype")}}</li>
+</ul>
diff --git a/files/en-us/web/api/element/index.html b/files/en-us/web/api/element/index.html
@@ -256,7 +256,7 @@ <h2 id="Methods">Methods</h2>
  <dd>Returns a {{DOMxRef("NodeList")}} of nodes which match the specified selector string relative to the element.</dd>
  <dt>{{DOMxRef("Element.releasePointerCapture()")}}</dt>
  <dd>Releases (stops) pointer capture that was previously set for a specific {{DOMxRef("PointerEvent","pointer event")}}.</dd>
- <dt>{{DOMxRef("ChildNode.remove()")}} {{Experimental_Inline}}</dt>
+ <dt>{{DOMxRef("Element.remove()")}}</dt>
  <dd>Removes the element from the children list of its parent.</dd>
  <dt>{{DOMxRef("Element.removeAttribute()")}}</dt>
  <dd>Removes the named attribute from the current node.</dd>

diff --git a/...en-us/web/api/childnode/remove/index.html → ...s/en-us/web/api/element/remove/index.html b/...en-us/web/api/childnode/remove/index.html → ...s/en-us/web/api/element/remove/index.html
@@ -1,23 +1,22 @@
 ---
-title: ChildNode.remove()
-slug: Web/API/ChildNode/remove
+title: Element.remove()
+slug: Web/API/Element/remove
 tags:
-- API
-- ChildNode
-- DOM
-- Method
+  - API
+  - Element
+  - DOM
+  - Method
 ---
 <div>{{APIRef("DOM")}}</div>
 
-<p>The <code><strong>ChildNode.remove()</strong></code> method removes the object from the
+<p>The <code><strong>Element.remove()</strong></code> method removes the element from the
   tree it belongs to.</p>
 
 <h2 id="Syntax">Syntax</h2>
 
-<pre class="brush: js"><var>node</var>.remove();
-</pre>
+<pre class="brush: js">remove()</pre>
 
-<h2 id="Example">Example</h2>
+<h2 id="Examples">Examples</h2>
 
 <h3 id="Using_remove">Using <code>remove()</code></h3>
 
@@ -30,7 +29,7 @@ <h3 id="Using_remove">Using <code>remove()</code></h3>
 el.remove(); // Removes the div with the 'div-02' id
 </pre>
 
-<h3 id="ChildNode.remove_is_unscopable"><code>ChildNode.remove()</code> is unscopable</h3>
+<h3 id="Element.remove_is_unscopable"><code>Element.remove()</code> is unscopable</h3>
 
 <p>The <code>remove()</code> method is not scoped into the <code>with</code> statement.
   See {{jsxref("Symbol.unscopables")}} for more information.</p>
@@ -46,31 +45,21 @@ <h2 id="Specifications">Specifications</h2>
   <thead>
     <tr>
       <th scope="col">Specification</th>
-      <th scope="col">Status</th>
-      <th scope="col">Comment</th>
     </tr>
   </thead>
   <tbody>
     <tr>
       <td>{{SpecName('DOM WHATWG', '#dom-childnode-remove', 'ChildNode.remove')}}</td>
-      <td>{{Spec2('DOM WHATWG')}}</td>
-      <td>Initial definition.</td>
     </tr>
   </tbody>
 </table>
 
 <h2 id="Browser_compatibility">Browser compatibility</h2>
 
-<p>{{Compat("api.ChildNode.remove")}}</p>
+<p>{{Compat("api.Element.remove")}}</p>
 
 <h2 id="See_also">See also</h2>
 
 <ul>
-  <li>The {{domxref("ChildNode")}} pure interface.</li>
-  <li>
-    <div class="brush: js">Object types implementing this pure interface:
-      {{domxref("CharacterData")}}, {{domxref("Element")}}, and
-      {{domxref("DocumentType")}}.</div>
-  </li>
   <li><a href="https://github.com/chenzhenxi/element-remove">Polyfill</a></li>
 </ul>
diff --git a/files/en-us/web/api/htmlselectelement/remove/index.html b/files/en-us/web/api/htmlselectelement/remove/index.html
@@ -97,7 +97,7 @@ <h2 id="Browser_compatibility">Browser compatibility</h2>
 <h2 id="See_also">See also</h2>
 
 <ul>
-  <li>{{ domxref("ChildNode.remove") }}, the method that gets called when remove is called
+  <li>{{ domxref("Element.remove") }}, the method that gets called when remove is called
     without arguments on a {{ domxref("HTMLSelectElement") }}.</li>
   <li>{{domxref("HTMLSelectElement") }} that implements it.</li>
 </ul>
diff --git a/files/en-us/web/api/node/removechild/index.html b/files/en-us/web/api/node/removechild/index.html
@@ -168,6 +168,6 @@ <h2 id="See_also">See also</h2>
 <ul>
   <li>{{domxref("Node.replaceChild()")}}</li>
   <li>{{domxref("Node.parentNode")}}</li>
-  <li>{{domxref("ChildNode.remove()")}}</li>
+  <li>{{domxref("Element.remove()")}}</li>
   <li>{{domxref("Node.cloneNode()")}}</li>
 </ul>