Preg_match_all html tag, except for tags in double or single quotes

Question

Given this DOM

$html=<<<'EOD'
<div class='container clickable' data-param='{"footer":"<div>Bye</div>","info":"We win"}'>
 <img src='a.jpg' />
</div>
<a href='a.html'>The A</a>
<span></span>
<span data-span-param='{"detailTag":"<span class=\"link\">Anything here</span>"}'>
 <a></a>
</span>  
EOD;  

I am trying to use preg_match_all html tags with this expression:

$tags = array();
if(preg_match_all('~<\s*[\w]+[^>]*>|<\s*/\s*[\w]+\s*>~im',$html,$matchall,PREG_SET_ORDER)){
   foreach($matchall as $m){
       $tags[] = $m[0];
   }
}  
print_r($tags);

The output of this expression:

    (
     [0] = > < div class= 'container clickable' data-param = '{ "footer": "<div>
     [1] = > </DIV>
     [2] = > < img src= 'a.jpg'/" >
     [3] = > </DIV>
     [4] = > < a href= 'a.html' >
     [5] = > </ >
     [6] = > <SPAN>
     [7] = > </SPAN>
     [8] = > < span data-span-param = '{ "detailTag": "< span class= \" link\" >
     [9] = > </SPAN>
     [10] = > <a>
     [11] = > </ >
     [12] = > </SPAN>
    )

:

    (
     [0] = > < div class= 'container clickable' data-param = '{ "footer": "<div> Bye </div> ", "info": " " }' >
     [1] = > < img src= 'a.jpg'/" >
     [2] = > </DIV>
     [3] = > < a href= 'a.html' >
     [4] = > </ >
     [5] = > <SPAN>
     [6] = > </SPAN>
     [7] = > < span data-span-param = '{ "detailTag": "< span class= \" link\" > </span> "}' >
     [8] = > <a>
     [9] = > </ >
     [10] = > </SPAN>
    )

.

Answer 1

, - .

(?!<\s*>)\<(?:(?>[^<>]+)|(?R))*\>

Answer 2

html ,

<?php
$html=<<<EOD
<div class='container clickable' data-param='{"footer"<div>Bye</div>","info":"We win"}'>
<img src='a.jpg' />
</div>
<a href='a.html'>The A</a>
<span></span>
<span data-span-param='{"detailTag":"<span class=\"link\">Anything here</span>"}'>
<a></a>
</span>
EOD;

$html = preg_replace('~\&lt\;~is','<',$html);
$html = preg_replace('~\&gt\;~is','>',$html);
//$html = preg_replace('~\&quot\;~is','"',$html);
$html = preg_replace('~=\s*\'\s*\'~is','=\'.\'',$html);
$html = preg_replace('~=\s*"\s*"~is','="."',$html);

if(preg_match_all('~((?<==\')(?:.(?!\'))*.)\'|((?<==")(?:.(?!"))*.)"~im',$html,$matchall,PREG_SET_ORDER)){
  foreach($matchall as $m){
    if(preg_match('~\<~is',$m[0],$mtch1)||preg_match('~\>~is',$m[0],$mtch2)){
        $end = $m[0][(strlen($m[0])-1)];
        $replace1 = substr($m[0],0,(strlen($m[0])-1));
        $replace = preg_replace('~"~is','&quot;',$replace1);
        $replace = preg_replace('~<~is','&lt;',$replace);
        $replace = preg_replace('~>~is','&gt;',$replace);
        $html = preg_replace("~".preg_quote(($end.$replace1.$end),'~')."~is",$end.$replace.$end,$html);
    }
  }
}

$tags = array();
if(preg_match_all('~<\s*[\w]+[^>]*>|<\s*/\s*[\w]+\s*>~im',$html,$matchall,PREG_SET_ORDER)){
  foreach($matchall as $m){ 
    $tags[] = $m[0];
  }
}

print_r($tags);
?> 

:

Array  
(  
[0] => <div class='container clickable' data-param='{&quot;footer&quot;:&quot;&lt;div&gt;Bye&lt;/div&gt;&quot;,&quot;info&quot;:&quot;We win&quot;}'>  
[1] => <img src='a.jpg' />  
[2] => </div>  
[3] => <a href='a.html'>  
[4] => </a>  
[5] => <span>  
[6] => </span>  
[7] => <span data-span-param='{&quot;detailTag&quot;:&quot;&lt;span class=\&quot;link\&quot;&gt;Anything here&lt;/span&gt;&quot;}'>  
[8] => <a>
[9] => </a>  
[10] => </span>  
)

Answer 3

This regular expression works in your code without additional code:

<\s*(?:/\s*)?\w++(?>[^>'"]++|'[^']+'|"[^"]+")*>

Demo