Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>MutationObserver Table</title>
  
</head>
<body>
  <div class="wrap">
    <div class="row">
      <span class="label">Observer counter: </span>
      <span id="observer-counter" class="badge">0</span>
    </div>
    <div class="row">
      <span class="label">Mutate counter:</span>
      <span id="mutate-counter" class="badge">0</span>
    </div>
    <div class="row" onclick="mutateTableTrs()">
      <button>Mutate &lt;tr&gt;s</button>
    </div>
  </div>
  
  
  <div class="wrap">
    <table id="table">
      <thead>
        <tr>
          <th><span class="cell">Lorem.</span></th>
          <th><span class="cell">In.</span></th>
          <th><span class="cell">Molestias.</span></th>
          <th><span class="cell">Molestias.</span></th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td><span class="cell">Lorem.</span></td>
          <td><span class="cell">Consequuntur.</span></td>
          <td><span class="cell">Consequatur.</span></td>
          <td><span class="cell">Eveniet.</span></td>
        </tr>
        <tr>
          <td><span class="cell">Lorem.</span></td>
          <td><span class="cell">Alias.</span></td>
          <td><span class="cell">Dolores!</span></td>
          <td><span class="cell">Porro?</span></td>
        </tr>
        <tr>
          <td><span class="cell">Lorem.</span></td>
          <td><span class="cell">Autem?</span></td>
          <td><span class="cell">Cum.</span></td>
          <td><span class="cell">Ipsum!</span></td>
        </tr>
        <tr>
          <td><span class="cell">Lorem.</span></td>
          <td><span class="cell">Repellat!</span></td>
          <td><span class="cell">Beatae!</span></td>
          <td><span class="cell">Nostrum.</span></td>
        </tr>
        <tr>
          <td><span class="cell">Lorem.</span></td>
          <td><span class="cell">Minus.</span></td>
          <td><span class="cell">Laudantium?</span></td>
          <td><span class="cell">Cumque.</span></td>
        </tr>
      </tbody>
    </table>
  </div>
  
  
</body>
</html>
Output

This bin was created anonymously and its free preview time has expired (learn why). — Get a free unrestricted account

Dismiss x
public
Bin info
anonymouspro
0viewers