Skip to main content
Commonmark migration
Origen Enlace

##Método 1: Accediendo al DOM (la forma correcta de hacerlo)

Método 1: Accediendo al DOM (la forma correcta de hacerlo)

##Método 2: Regex (puede fallar)

Método 2: Regex (puede fallar)

##Método 1: Accediendo al DOM (la forma correcta de hacerlo)

##Método 2: Regex (puede fallar)

Método 1: Accediendo al DOM (la forma correcta de hacerlo)

Método 2: Regex (puede fallar)

Simplemente un espacio de más en la tabulación del código, pero me molestaba visualmente
Origen Enlace
Mariano
  • 24.5k
  • 20
  • 76
  • 105
function doGet() {
  // En vez de obtener el html con UrlFetchApp.fetch(), se usa esto a modo de ejemplo
  var html = '<html>'
           + '   <body>'
           + '     <p>Texto a borrar</p>'
           + '     <form>'
           + '       <input type="radio" name="sexo" value="masculino" checked="1"> Masculino<br>'
           + '       <input type="radio" name="sexo" value="femenino"> Femenino'
           + '     </form>'
           + '     <p>Esto no debe aparecer</p>'
           + '     <form>'
           + '       Segundo form <input type="button" value="Funciona">'
           + '     </form>'
           + '   </body>'
           + ' <'</html>';
  
  var regex = /<\s*form\b[\s\S]*?<\s*\/\s*form\b[^>]*>/gi;
  
  // Se extraen todos los forms del html y se unen en un string
  var forms = html.match(regex);
  var resultado = forms.join('');
  return HtmlService.createHtmlOutput(resultado);
}
function doGet() {
  // En vez de obtener el html con UrlFetchApp.fetch(), se usa esto a modo de ejemplo
  var html = '<html>'
           + '   <body>'
           + '     <p>Texto a borrar</p>'
           + '     <form>'
           + '       <input type="radio" name="sexo" value="masculino" checked="1"> Masculino<br>'
           + '       <input type="radio" name="sexo" value="femenino"> Femenino'
           + '     </form>'
           + '     <p>Esto no debe aparecer</p>'
           + '     <form>'
           + '       Segundo form <input type="button" value="Funciona">'
           + '     </form>'
           + '   </body>'
           + ' </html>';
  
  var regex = /<\s*form\b[\s\S]*?<\s*\/\s*form\b[^>]*>/gi;
  
  // Se extraen todos los forms del html y se unen en un string
  var forms = html.match(regex);
  var resultado = forms.join('');
  return HtmlService.createHtmlOutput(resultado);
}
function doGet() {
  // En vez de obtener el html con UrlFetchApp.fetch(), se usa esto a modo de ejemplo
  var html = '<html>'
           + '  <body>'
           + '    <p>Texto a borrar</p>'
           + '    <form>'
           + '      <input type="radio" name="sexo" value="masculino" checked="1"> Masculino<br>'
           + '      <input type="radio" name="sexo" value="femenino"> Femenino'
           + '    </form>'
           + '    <p>Esto no debe aparecer</p>'
           + '    <form>'
           + '      Segundo form <input type="button" value="Funciona">'
           + '    </form>'
           + '  </body>'
           + '</html>';
  
  var regex = /<\s*form\b[\s\S]*?<\s*\/\s*form\b[^>]*>/gi;
  
  // Se extraen todos los forms del html y se unen en un string
  var forms = html.match(regex);
  var resultado = forms.join('');
  return HtmlService.createHtmlOutput(resultado);
}
Recompensa finalizada con 100 de reputación otorgada por Rubén
Emprolijé el texto (sólo detalles)
Origen Enlace
Mariano
  • 24.5k
  • 20
  • 76
  • 105

El regex que estás usando no coincide con el form porque estás usandoen .*?, y el punto coincide con cualquier caracter menos los saltos de línea. En cuanto a tu pregunta, los modificadoresmodificadores /g/g y /m/m no tienen nada que ver con este comportamiento. /g/g hace que se devuelvan todas las coincidencias, y /m/m cambia el comportamiento de ^ y $ exclusivamente.

##1.##Método 1: Accediendo al DOM (la forma correcta de hacerlo)

UsandoCon XMLService podemos usar el DOM (Document Object Model), lo cual permite seleccionar todos los tags <form> presentes en el documento.

XMLService tiene el método .parse() para procesar un string llano estructurado como documento XML. Sin embargo, no es para nada permisivo. Sólo permiteacepta XML válido y bien estructurado (algo que casi ninguna página web cumple). Y, para lograr procesarlo, podemos realizar un "truco". Una versión más antigua de XMLService, el servicio XML, es mucho más permisivoindulgente y acepta un HTML común, convirtiéndolo en XML válido. Así, una vez procesado, podemos pasarlo a XMLService. La mala noticia: XML está obsoleto y no se sabe cuánto tiempo seguirá disponible. Pero por el momento funciona.

Esta forma es segura y a prueba de fallos, ya que cualquier problema con el HTML, se detectaría enluego de XML.parse(), evitando una salida de texto incorrecta.

function doGet() {
  // En vez de obtener el html con UrlFetchApp.fetch(), se usa esto a modo de ejemplo
  var html = '<html>'
           + '   <body>'
           + '     <p>Texto a borrar</p>'
           + '     <form>'
           + '       <input type="radio" name="sexo" value="masculino" checked="1"> Masculino<br>'
           + '       <input type="radio" name="sexo" value="femenino"> Femenino'
           + '     </form>'
           + '     <p>Esto no debe aparecer</p>'
           + '     <form>'
           + '       Segundo form <input type="button" value="Funciona">'
           + '     </form>'
           + '   </body>'
           + ' <'</html>';
  
  // Se crea el documento
  var doc = Xml.parse(html, true);        //Xml.parse está obsoleto pero sigue funcionando y mejor que XmlService
  var body = doc.html.body.toXmlString(); //truco para que funcione XmlService (sino no acepta HTML que no cumple como XML)
  var atom = XmlService.getNoNamespace();
  doc = XmlService.parse(body);
  var root = doc.getRootElement();
  var i, resultado = '';
  
  // Se obtienen todos los forms
  var forms = getElementsByTagName(root, 'form');
  
  // Se unen en un string
  for(i in forms) resultado += XmlService.getRawFormat().format(forms[i]);
  
  // Envíar resultado como salida del script
  return HtmlService.createHtmlOutput(resultado);
}

function getElementsByTagName(element, tagName) {  
  // Fuente: https://sites.google.com/site/scriptsexamples/learn-by-example/parsing-html
  var data = [];
  var descendants = element.getDescendants();
  for(i in descendants) {
    var elt = descendants[i].asElement();     
    if( elt !=null && elt.getName()== tagName) data.push(elt);      
  }
  return data;
}

La clave de esto es que una vez convertido a XML, tenemos la ventaja de tenercontar con funciones para movernos por/agregar/modificar partes específicas de cada elemento. Usamos el método getDescendants() para obtener todos los nodos, y getName() para ver si es un form.

<body><form> <input type="radio" name="sexo" value="masculino" checked="1"> Masculino<br> <input type="radio" name="sexo" value="femenino"> Femenino </form><form> Segundo form <input type="button" value="Funciona"> </form></body>
<body><form> <input type="radio" name="sexo" value="masculino" checked="1"> Masculino<br> <input type="radio" name="sexo" value="femenino"> Femenino </form><form> Segundo form <input type="button" value="Funciona"> </form></body>

##2.##Método 2: Regex (puede fallar)

demo en regex101.comdemo en regex101.com

  • <\s*form Coincide con < ++ 0 o más espacios ++ form
  • \b coincide si está en una posición que es un límite de palabra completa (así coincide con form y no con formosa).
  • [\s\S]*? coincide con cualquier caracter repetido 0 o más veces. Además, el último ? hace que la repetición se comporte sin avaricia, o sea que se repita la menor cantidad de veces posibles (esta sintaxis soluciona el problema de /.*?/s).
  • <\s*\/\s*form\b es el patrón para </form, que puede tener espacios alrededor de la barra y debe ser una palabra completa.
  • [^>]* consume todos los caracteres, cualquier caracter excepto >.
  • > coincide con el final del tag.
  • /gi Establece los modos: global, para que devuelva todos los resultados que encuentre; y sin diferenciar entre mayúsculas y minúsculas.

Y esto se puede arreglar fácilmente, pero después tendremos otro caso raro que lo haría fallar y se podría arreglar, y después otro, y otro, y así sucesivamente.

El regex que estás usando no coincide con el form porque estás usando .*?, y el punto coincide con cualquier caracter menos los saltos de línea. En cuanto a tu pregunta, los modificadores /g y /m no tienen nada que ver con este comportamiento. /g hace que se devuelvan todas las coincidencias, y /m cambia el comportamiento de ^ y $ exclusivamente.

##1. Accediendo al DOM (la forma correcta de hacerlo)

Usando XMLService podemos usar el DOM (Document Object Model), lo cual permite seleccionar todos los tags <form> presentes en el documento.

XMLService tiene el método .parse() para procesar un string llano estructurado como documento XML. Sin embargo, no es para nada permisivo. Sólo permite XML válido y bien estructurado (algo que casi ninguna página web cumple). Y, para lograr procesarlo, podemos realizar un "truco". Una versión más antigua de XMLService, el servicio XML, es mucho más permisivo y acepta un HTML común, convirtiéndolo en XML válido. Así, una vez procesado, podemos pasarlo a XMLService. La mala noticia: está obsoleto y no se sabe cuánto tiempo seguirá disponible. Pero por el momento funciona.

Esta forma es segura y a prueba de fallos, ya que cualquier problema con el HTML, se detectaría en XML.parse(), evitando una salida de texto incorrecta.

function doGet() {
  // En vez de obtener el html con UrlFetchApp.fetch(), se usa esto a modo de ejemplo
  var html = '<html>'
           + '   <body>'
           + '     <p>Texto a borrar</p>'
           + '     <form>'
           + '       <input type="radio" name="sexo" value="masculino" checked="1"> Masculino<br>'
           + '       <input type="radio" name="sexo" value="femenino"> Femenino'
           + '     </form>'
           + '     <p>Esto no debe aparecer</p>'
           + '     <form>'
           + '       Segundo form <input type="button" value="Funciona">'
           + '     </form>'
           + '   </body>'
           + ' </html>';
  
  // Se crea el documento
  var doc = Xml.parse(html, true);        //Xml.parse está obsoleto pero sigue funcionando y mejor que XmlService
  var body = doc.html.body.toXmlString(); //truco para que funcione XmlService (sino no acepta HTML que no cumple como XML)
  var atom = XmlService.getNoNamespace();
  doc = XmlService.parse(body);
  var root = doc.getRootElement();
  var i, resultado = '';
  
  // Se obtienen todos los forms
  var forms = getElementsByTagName(root, 'form');
  
  // Se unen en un string
  for(i in forms) resultado += XmlService.getRawFormat().format(forms[i]);
  
  // Envíar resultado como salida del script
  return HtmlService.createHtmlOutput(resultado);
}

function getElementsByTagName(element, tagName) {  
  // Fuente: https://sites.google.com/site/scriptsexamples/learn-by-example/parsing-html
  var data = [];
  var descendants = element.getDescendants();
  for(i in descendants) {
    var elt = descendants[i].asElement();     
    if( elt !=null && elt.getName()== tagName) data.push(elt);      
  }
  return data;
}

La clave de esto es que una vez convertido a XML, tenemos la ventaja de tener funciones para movernos por/agregar/modificar partes específicas de cada elemento. Usamos el método getDescendants() para obtener todos los nodos, y getName() para ver si es un form.

<body><form> <input type="radio" name="sexo" value="masculino" checked="1"> Masculino<br> <input type="radio" name="sexo" value="femenino"> Femenino </form><form> Segundo form <input type="button" value="Funciona"> </form></body>

##2. Regex (puede fallar)

demo en regex101.com

  • <\s*form Coincide con < + 0 o más espacios + form
  • \b coincide si está en una posición que es un límite de palabra completa (así coincide con form y no con formosa.
  • [\s\S]*? coincide con cualquier caracter repetido 0 o más veces. Además, el último ? hace que la repetición se comporte sin avaricia, o sea que se repita la menor cantidad de veces posibles.
  • <\s*\/\s*form\b es el patrón para </form, que puede tener espacios alrededor de la barra y debe ser una palabra completa.
  • [^>]* consume todos los caracteres, cualquier caracter excepto >.
  • > coincide con el final del tag.
  • /gi Establece los modos: global, para que devuelva todos los resultados que encuentre; y sin diferenciar entre mayúsculas y minúsculas.

Y esto se puede arreglar fácilmente, pero después tendremos otro caso raro que lo haría fallar, y después otro, y otro, y así sucesivamente.

El regex que estás usando no coincide con el form porque en .*?, el punto coincide con cualquier caracter menos los saltos de línea. En cuanto a tu pregunta, los modificadores /g y /m no tienen nada que ver con este comportamiento. /g hace que se devuelvan todas las coincidencias, y /m cambia el comportamiento de ^ y $ exclusivamente.

##Método 1: Accediendo al DOM (la forma correcta de hacerlo)

Con XMLService podemos usar el DOM (Document Object Model), lo cual permite seleccionar todos los tags <form> presentes en el documento.

XMLService tiene el método .parse() para procesar un string llano estructurado como documento XML. Sin embargo, no es para nada permisivo. Sólo acepta XML válido y bien estructurado (algo que casi ninguna página web cumple). Y, para lograr procesarlo, podemos realizar un "truco". Una versión más antigua de XMLService, el servicio XML, es mucho más indulgente y acepta un HTML común, convirtiéndolo en XML válido. Así, una vez procesado, podemos pasarlo a XMLService. La mala noticia: XML está obsoleto y no se sabe cuánto tiempo seguirá disponible. Pero por el momento funciona.

Esta forma es segura y a prueba de fallos, ya que cualquier problema con el HTML, se detectaría luego de XML.parse(), evitando una salida de texto incorrecta.

function doGet() {
  // En vez de obtener el html con UrlFetchApp.fetch(), se usa esto a modo de ejemplo
  var html = '<html>'
           + '  <body>'
           + '    <p>Texto a borrar</p>'
           + '    <form>'
           + '      <input type="radio" name="sexo" value="masculino" checked="1"> Masculino<br>'
           + '      <input type="radio" name="sexo" value="femenino"> Femenino'
           + '    </form>'
           + '    <p>Esto no debe aparecer</p>'
           + '    <form>'
           + '      Segundo form <input type="button" value="Funciona">'
           + '    </form>'
           + '  </body>'
           + '</html>';
  
  // Se crea el documento
  var doc = Xml.parse(html, true);        //Xml.parse está obsoleto pero sigue funcionando y mejor que XmlService
  var body = doc.html.body.toXmlString(); //truco para que funcione XmlService (sino no acepta HTML que no cumple como XML)
  var atom = XmlService.getNoNamespace();
  doc = XmlService.parse(body);
  var root = doc.getRootElement();
  var i, resultado = '';
  
  // Se obtienen todos los forms
  var forms = getElementsByTagName(root, 'form');
  
  // Se unen en un string
  for(i in forms) resultado += XmlService.getRawFormat().format(forms[i]);
  
  // Envíar resultado como salida del script
  return HtmlService.createHtmlOutput(resultado);
}

function getElementsByTagName(element, tagName) {  
  // Fuente: https://sites.google.com/site/scriptsexamples/learn-by-example/parsing-html
  var data = [];
  var descendants = element.getDescendants();
  for(i in descendants) {
    var elt = descendants[i].asElement();     
    if( elt !=null && elt.getName()== tagName) data.push(elt);      
  }
  return data;
}

La clave de esto es que una vez convertido a XML, tenemos la ventaja de contar con funciones para movernos por/agregar/modificar partes específicas de cada elemento. Usamos el método getDescendants() para obtener todos los nodos, y getName() para ver si es un form.

<body><form> <input type="radio" name="sexo" value="masculino" checked="1"> Masculino<br> <input type="radio" name="sexo" value="femenino"> Femenino </form><form> Segundo form <input type="button" value="Funciona"> </form></body>

##Método 2: Regex (puede fallar)

demo en regex101.com

  • <\s*form Coincide con < + 0 o más espacios + form
  • \b coincide si está en una posición que es un límite de palabra completa (así coincide con form y no con formosa).
  • [\s\S]*? coincide con cualquier caracter repetido 0 o más veces. Además, el último ? hace que la repetición se comporte sin avaricia, o sea que se repita la menor cantidad de veces posibles (esta sintaxis soluciona el problema de /.*?/s).
  • <\s*\/\s*form\b es el patrón para </form, que puede tener espacios alrededor de la barra y debe ser una palabra completa.
  • [^>]* consume todos los caracteres, cualquier caracter excepto >.
  • > coincide con el final del tag.
  • /gi Establece los modos: global, para que devuelva todos los resultados que encuentre; y sin diferenciar entre mayúsculas y minúsculas.

Y esto se puede arreglar fácilmente, pero después tendremos otro caso raro que lo haría fallar y se podría arreglar, y después otro, y otro, y así sucesivamente.

redacción (detalle)
Origen Enlace
Mariano
  • 24.5k
  • 20
  • 76
  • 105
Loading
Info sobre el truco con XML.parse()
Origen Enlace
Mariano
  • 24.5k
  • 20
  • 76
  • 105
Loading
Origen Enlace
Mariano
  • 24.5k
  • 20
  • 76
  • 105
Loading