JSFiddle - React, Tailwind, and code Playground

by Julien Etienne

JavaScript

console.time('t')
const string = `<div id="test" class="center clear">
      

    <div class="wiki-main-content" id="document-main"><div class="center">
      <!-- start the main content container -->
        <div id="wiki-column-container" class="wiki-left-present">

          <!-- content row with three strips -->
          <div class="column-container column-container-reverse">

            <!-- center: main article content -->
            <div id="wiki-content" class="column-main wiki-column text-content">

              

              
                
              
              

              

              
              

              <!-- just the article content -->
              <article id="wikiArticle">
                
                  
                    <div></div>

<p>The <strong><code>insertAdjacentHTML()</code></strong> method of the <a href="/en-US/docs/Web/API/Element" title="Element is the most general base class from which all objects in a Document inherit. It only has methods and properties common to all kinds of elements. More specific classes inherit from Element."><code>Element</code></a> interface parses the specified text as HTML or XML and inserts the resulting nodes into the DOM tree at a specified position. It does not reparse the element it is being used on, and thus it does not corrupt the existing elements inside that element. This avoids the extra step of serialization, making it much faster than direct <a href="/en-US/docs/Web/API/Element/innerHTML" title="The Element property innerHTML gets or sets the HTML or XML markup contained within the element."><code>innerHTML</code></a> manipulation.</p>

<h2 id="Syntax">Syntax<a href="/en-US/docs/Web/API/Element/insertAdjacentHTML$edit#Syntax" class="button section-edit only-icon" rel="nofollow, noindex"><svg class="icon icon-pencil" version="1.1" width="24" height="28" viewBox="0 0 24 28" aria-hidden="true" focusable="false"><path d="M5.672 24l1.422-1.422-3.672-3.672-1.422...