Node.contains

  • Revision slug: DOM/Node.contains
  • Revision title: Node.contains
  • Revision id: 295771
  • Created:
  • Creator: mattcg
  • Is current revision? No
  • Comment

Revision Content

{{ DomRef() }}

Summary

Indicates whether a node is a descendent of a given node.

Syntax

node.contains( otherNode ) 
  • node is the node that's being compared.
  • otherNode is the node that's being compared against.

The return value is true if otherNode is a descendent of node, or node itself. Otherwise the return value is false.

Example

This function checks to see if an element is in the page's body. As contains is inclusive and determining if the body contains itself isn't the intention of isInPage this case explicitly returns false.

function isInPage(node) {
  return (node === document.body) ? false : document.body.contains(node);
}
  • node is the node we want to check for in the <body>.

Browser compatibility

{{ CompatibilityTable() }}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support {{ CompatVersionUnknown() }} {{ CompatGeckoDesktop("9.0") }} {{ CompatVersionUnknown() }}

{{ CompatVersionUnknown() }}

{{ CompatVersionUnknown() }}
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support {{ CompatUnknown() }} {{ CompatGeckoMobile("9.0") }} {{ CompatUnknown() }} {{ CompatUnknown() }} {{ CompatUnknown() }}

Specification

DOM Level 4: contains

{{ languages( { "zh-cn": "zh-cn/DOM/Node.contains"} ) }}

Revision Source

<p>{{ DomRef() }}</p>
<h3 id="Summary" name="Summary">Summary</h3>
<p>Indicates whether a node is a descendent of a given node.</p>
<h3 id="Syntax" name="Syntax">Syntax</h3>
<pre class="eval">
node.contains( otherNode ) 
</pre>
<ul>
  <li><code>node</code> is the node that's being compared.</li>
  <li><code>otherNode</code> is the node that's being compared against.</li>
</ul>
<p>The return value is <code>true</code> if <code>otherNode</code> is a descendent of <code>node</code>, or <code>node</code> itself. Otherwise the return value is <code>false</code>.</p>
<h3 id="Notes" name="Notes">Example</h3>
<p>This function checks to see if an element is in the page's body. As <code>contains</code> is inclusive and determining if the body contains itself isn't the intention of <code>isInPage</code> this case explicitly returns <code>false</code>.</p>
<pre class="eval">
function isInPage(node) {
&nbsp; return (node === document.body) ? false : document.body.contains(node);
}
</pre>
<ul>
  <li><code>node</code>&nbsp;is the node we want to check for in the <code>&lt;body&gt;</code>.</li>
</ul>
<h2 id="Browser_compatibility">Browser compatibility</h2>
<p>{{ CompatibilityTable() }}</p>
<div id="compat-desktop">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Chrome</th>
        <th>Firefox (Gecko)</th>
        <th>Internet Explorer</th>
        <th>Opera</th>
        <th>Safari</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>{{ CompatVersionUnknown() }}</td>
        <td>{{ CompatGeckoDesktop("9.0") }}</td>
        <td>{{ CompatVersionUnknown() }}</td>
        <td>
          <p>{{ CompatVersionUnknown() }}</p>
        </td>
        <td>{{ CompatVersionUnknown() }}</td>
      </tr>
    </tbody>
  </table>
</div>
<div id="compat-mobile">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Android</th>
        <th>Firefox Mobile (Gecko)</th>
        <th>IE Mobile</th>
        <th>Opera Mobile</th>
        <th>Safari Mobile</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>{{ CompatUnknown() }}</td>
        <td>{{ CompatGeckoMobile("9.0") }}</td>
        <td>{{ CompatUnknown() }}</td>
        <td>{{ CompatUnknown() }}</td>
        <td>{{ CompatUnknown() }}</td>
      </tr>
    </tbody>
  </table>
</div>
<h3 id="Specification" name="Specification">Specification</h3>
<p><a class="external" href="http://www.w3.org/TR/domcore/#dom-node-contains" title="http://www.w3.org/TR/domcore/#dom-node-contains">DOM Level 4: contains</a></p>
<p>{{ languages( { "zh-cn": "zh-cn/DOM/Node.contains"} ) }}</p>
Revert to this revision