¿Cómo escapar correctamente las comillas dentro de los atributos html?

180

Tengo un menú desplegable en una página web que se está rompiendo cuando la cadena de valor contiene una cita.¿Cómo escapar correctamente las comillas dentro de los atributos html?

El valor es "asd pero en el DOM siempre aparece como una cadena vacía.

He intentado de todas las formas que conozco para escapar de la cadena correctamente, pero fue en vano.

<option value=""asd">test</option> 
<option value="\"asd">test</option> 
<option value="&quot;asd">test</option> 
<option value="&#34;asd">test</option>

¿Alguna idea de cómo presentar esto en la página para que el mensaje de devolución contenga el valor correcto?

Fuente

2010-10-25 Chris

¿Cómo está generando la página? – SLaks

¿Qué sucede si utiliza comillas simples? –

Tengo que señalar que ninguna de estas respuestas dice cómo escaparse correctamente de cadenas para usar dentro de los atributos html – reconbot

250

" es la forma correcta, la tercera parte de sus pruebas:

<option value="&quot;asd">test</option>

se puede ver este trabajo en un ejemplo jsFiddle here. Alternativamente, se puede delimitar el valor de atributo entre comillas simples:

<option value='"asd'>test</option>

Fuente

2010-10-25 14:11:06

+15

La cuarta opción de OP, ", también es una forma válida de evitar las comillas. Aquí hay un beneficio al usar entidades numéricas html sobre entidades nombradas, en que las entidades nombradas no cubren todos los caracteres, mientras que las entidades numéricas sí lo hacen. La lista completa de HTML4 está en http://www.w3.org/TR/html4/sgml/entities.html. – atk

+27

@atk: sí, '"' se asigna al mismo carácter que '"', pero no hay beneficio de usar aquí la opción numérica porque '"' es una entidad con nombre definido. '"' también es más fácil de recordar. –

Estoy de acuerdo. En este caso particular, es más fácil de usar ". Solo intenté señalar el caso general. – atk

Realmente sólo se debe permitir que los datos no se confía en una lista blanca de buenos atributos como: alinear, alink, alt, bgcolor, frontera, cellpadding, espaciado de celda, clase, color, cols, colspan, coords, dir, cara, altura, hspace, ismap, lang, marginheight, marginwidth, multiple, nohref, noresize, noshade, nowrap, ref, rel, rev, filas, rowspan, desplazamiento, forma, span, summary, tabindex, title, usemap, valign, value, vlink, vspace, width

Realmente desea mantener los datos no confiables fuera de los manejadores de javascript, así como los atributos id o name (pueden atrapar otros elementos en el DOM).

Además, si está colocando datos no confiables en un atributo SRC o HREF, entonces realmente no es una URL confiable, por lo que debe validar la URL, asegúrese de que NO sea una javascript: URL y luego codificar la entidad HTML.

Más detalles sobre todos los que hay aquí: https://www.owasp.org/index.php/Abridged_XSS_Prevention_Cheat_Sheet

Fuente

2011-11-20 02:12:51

Sé que esto es tarde, pero casi todos esos atributos están en desuso en HTML4.01 y eliminados en 5. Puede que no importen ahora de todos modos, ya que hay mejores formas de protegerse, simplemente indicándolo. – trysis

La pregunta es preguntar sobre datos con caracteres de comillas en él, no sobre datos no confiables. – Quentin

Otra opción está reemplazando comillas dobles con comillas simples, si no le importa lo que sea. Pero no menciono éste:

<option value='"asd'>test</option>

menciono éste:

<option value="'asd">test</option>

En mi caso he utilizado esta solución.

Fuente

2012-11-27 09:00:39 csonuryilmaz

Pero si el valor contiene comillas simples y dobles, esto fallará – Raptor

@Raptor Dije que si el valor contiene comillas dobles, conviértalos a comillas simples. Si el valor contiene comillas simples, entonces lo hará no hay problema. – csonuryilmaz

Si está utilizando PHP, intente llamar a la función htmlentities o htmlspecialchars.

Fuente

2013-06-13 12:36:03

Hay problemas con esas funciones: http : //wonko.com/post/html-escaping –

por HTML syntax, e incluso HTML5, los siguientes son todas las opciones válidas:

<option value="&quot;asd">test</option> 
<option value="&#34;asd">test</option> 
<option value='"asd'>test</option> 
<option value='&quot;asd'>test</option> 
<option value='&#34;asd'>test</option> 
<option value=&quot;asd>test</option> 
<option value=&#34;asd>test</option>

Tenga en cuenta que si está utilizando XML syntax se requieren las comillas (simples o dobles).

Here's a jsfiddle showing all of the above working.

Fuente

2016-01-19 15:43:53 aij

¿Cómo escapar correctamente las comillas dentro de los atributos html?

Respuesta

Cuestiones relacionadas