js expresiones regulares coinciden con etiquetas img, etiquetas p, etiquetas div y otras soluciones de etiquetas personalizadas

js expresiones regulares coinciden con etiquetas img, etiquetas p, etiquetas div y otras soluciones de etiquetas personalizadas

Como desarrollo front-end, definitivamente habrá momentos en los que se procesen las cadenas.Si solo reemplaza, elimina e intercepta cadenas fijas, entonces el problema no es muy grande.
Pero, ¿y si la cadena no está fijada? Por ejemplo, para tratar con etiquetas Img, etiquetas p, etiquetas div, etc. en cadenas de texto enriquecido, puede que no sea fácil usar los métodos normales indexOf y substr.
Puede ser mejor usar expresiones regulares en este momento:

Etiquetas p coincidentes:

let reg = /<p(?:(?!<\/p>).|\n)*?<\/p>/gm

hacer coincidir la etiqueta img

let reg = /<img(?:(?!\/>).|\n)*?\/>/gm

Coincidir con etiquetas personalizadas

let reg = /<自定义(?:(?!<\/自定义>).|\n)*?<\/自定义>/gm

De hecho, se puede observar que existen principalmente dos tipos de regularización:

Una es hacer coincidir <etiqueta/>

El segundo es hacer coincidir <label></label>

Debido a que es una forma fija de escribir, puede usar eval() para deletrear dinámicamente expresiones regulares para que coincidan con sus cadenas.
como sigue:

let tagAry = ['a','div','p','h2'];
let str = '<div>31212<p>123</p></div><p>h31223<div>rtrttt</div></p>';
for(let i=0;i<tagAry.length;i++){
    
    
   let reg = new RegExp(`<${
      
      tagAry[i]}(?:(?!<\/${
      
      tagAry[i]}>).|\n)*?<\/${
      
      tagAry[i]}>`,'gm');
   str.replace(reg,(str)=>{
    
    
      console.log(str,'str')
   })
}

Pero todavía hay un problema:
tome la etiqueta div como ejemplo:
la regularidad es la siguiente:

let reg = /<div(?:(?!<\/div>).|\n)*?<\/div>/gm

Si la cadena es:

let str = '<div>1
             <div>2
               <div>3</div>
             </div>
           </div>';

De esta manera, habrá problemas con el emparejamiento.El
resultado del emparejamiento es:

<div>1<div>2</div>

Esta notación es problemática para las etiquetas de cadenas anidadas.
Sin embargo, además del anidamiento de etiquetas div , nadie escribirá otra etiqueta p en la etiqueta p ;

Pero, de nuevo, nada es absoluto.
En general, todavía se recomienda tratar con cadenas de una sola etiqueta, como img , o no debe haber cadenas de etiquetas anidadas.