website stats » Eliminar etiquetas HTML con Javascript | Solo Código |

Eliminar etiquetas HTML con Javascript

Escrito por J.F. el Viernes, 7 de Diciembre del 2007 a las 13:47

Vamos a ver como podemos eliminar todas las etiquetas HTML de un texto mediante el uso de Javascript y una expresión regular. Eliminar las etiquetas HTML de un texto es necesario multitud de veces, para evitar que un usuario malintencionado haga mal uso de la permisividad del uso de dichas etiquetas.

Seguro que en alguna ocasión has observado que en foros, en vez de permitir utilizar etiquetas HTML para dar formato a los mensajes, utilizan otro tipo de etiquetas denominadas BBCode. Sin duda la principal razón de evitar la inserción de código HTML es frenar los ataques XSS como ya hemos comprobado en anteriores ocasiones. La función en cuestión para quitar de una cadena todo resto de HTML, es la siguiente:

JavaScript:
  1. function stripHTML(cadena)
  2. {
  3.     return cadena.replace(/<[^>]+>/g,'');
  4. }

Con el empleo de esa expresión regular, eliminamos cualquier cosa que se encuentre delimitada con los caracteres < >. Simplemente hemos de pasarle como parámetro, la variable en la que almacenemos el texto del cual queremos eliminar cualquier signo de HTML. A continuación un pequeño ejemplo, en el cual podrás escribir en un textarea todo el código que quieras, y al hacer click en un botón en el de al lado aparecerá el resultado sin las etiquetas HTML:

HTML:
  1. function stripHTML(cadena)
  2. {
  3.     document.all.sinHTML.value = cadena.replace(/<[^>]+>/g,'');
  4. }
  5. </script>
  6. </head>
  7. <h2>Introduce texto con HTML</h2>
  8.  
  9. <p><textarea cols="40" rows="10" name="texto" onBlur="stripHTML(this.value);">
  10. &lt;p align="center"&gt;El texto no contendra el formato HTMl, porque &lt;b&gt;va a ser eliminado.&lt;/b&gt;&lt;hr/&gt;&lt;/p&gt;
  11. </textarea></p>
  12.  
  13. <p><input type="button" value="Eliminar HTML" onClick="stripHTML(document.all.texto.value);"/></p>
  14.  
  15. <h2>Texto sin HTML</h2>
  16.  
  17. <p><textarea cols="40" rows="10" name="sinHTML" readOnly="true">
  18. </textarea></p>
  19.  
  20. </body>
  21. </html>

Categoria: Javascript

No hay comentarios

Entradas relacionadas


Deja un comentario

Escribir un comentario

Puedes usar las siguientes etiquetas HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>

Solo Código

Solo Código es una colección de códigos de todo tipo que pueden resultar útiles para el diseño de páginas web. Está enfocado tanto para aquellos que son expertos, como para aquellos principiantes que quieren encontrar recursos útiles, o no saben implementar determinadas funciones en sus webs. No olvides que Solo Código es un blog de Informática Práctica, donde tenemos otras secciones interesantes como:
| Tutoriales | Trucos | Software | Links | Buscar |