1

tengo el siguiente código javascript:

var texto = "<div class='hola'> content </div>"+
"<div class='mundo'> </div>";

var classRE = /class=[\'|"](\w+)[\'|"]/;

console.log(classRE.exec(texto));

Me gustaría que la expresión regular me devolviera todas las clases presentes en texto. Logre que me devuelva solo la clase en el primer div pero me gustaría recibir también las del segundo div, y todos los que puedan existir. Soy nuevo con ER. Agradezco mucho su ayuda. Gracias.

2 respuestas 2

0

Te recomendaría no utilizar expresiones regulares para parsear HTML. Aunque posible, no es lo más recomendado.

Efectivamente tu entrada es texto, pero puedes convertirla a nodos html y después procesarlos con javascript.

Para conseguirlo puedes crear un elemento html e insertar dentro con innerHTML los nodos que quieres parsear.

Por ejemplo:

var h = document.createElement("body");
h.innerHTML = texto.trim();

Después, puedes utilizar javascript para obtener las classes.

Por ejemplo, podrías hacer algo así:

var texto = "<div class='hola'> content </div>" +
            "<div class='mundo mundano'> </div>" + 
            "<div class='fuera'><div class='dentro'></div></div>"
            ;

var h = document.createElement("body");
h.innerHTML = texto.trim();

var classes = [].concat(...
  Array.from(h.querySelectorAll('[class]:not([class=""])'))
  .map(x => x.className.trim().split(/\s+/))
);

console.log(classes);

0

No es la mejor forma pero he hecho esto con Jquery y al menos si no es muy eficiente es eficaz

$(document).ready(function(){
  var clases = [];
  var parent = $("body");
  var divs = parent.children();

  for(var i = 0; i < divs.length; i++){

    clases.push(divs[i].className)
  }

  console.log(clases);

});

Y tus clases en el Dom

<body>    
    <div class="Clase_1 Clase_12"></div>
    <div class="Clase_2"></div>
    <div class="Clase_3"></div>
</body>

Resultado del console.log():

 (3) ["Clase_1 Clase_12", "Clase_2", "Clase_3"]
1
  • Yo quiero analizar texto tal como dije en la pregunta. el 28 abr. 2019 a las 16:14

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.