Un elemento “script” con un atributo “src” no debe tener un atributo “type” cuyo valor sea algo diferente a la cadena vacía, un tipo MIME de JavaScript, o “module”.

El elemento <script> tiene dos propósitos distintos en HTML: cargar scripts ejecutables e incrustar bloques de datos no ejecutables. Cuando el atributo src está presente, el elemento siempre se está utilizando para cargar un script externo, por lo que el atributo type debe reflejar un tipo de script válido. Configurar type a algo como "text/html", "text/plain", o un valor inventado como "wrong" le dice al navegador que esto no es JavaScript, lo que significa que el archivo externo referenciado por src será descargado pero nunca ejecutado — casi con seguridad no es lo que el autor pretendía.

La especificación HTML restringe los valores permitidos de type para <script src="..."> a tres categorías:

• Una cadena vacía (type=""): Se trata igual que el valor por defecto, que es JavaScript.
• Un tipo MIME de JavaScript: Esto incluye text/javascript, application/javascript, y otros tipos MIME de JavaScript legacy. Como text/javascript es el valor por defecto, especificarlo es redundante.
• module: Indica que el script debe ser tratado como un módulo de JavaScript, habilitando la sintaxis import/export y ejecución diferida por defecto.

Cualquier valor fuera de estas categorías — como text/html, application/json, o una cadena inventada — es inválido cuando src está presente.

Por qué esto importa

Funcionalidad rota: Un type que no sea de JavaScript en un <script> con src impide que el navegador ejecute el archivo cargado. El script es efectivamente código muerto que aún cuesta una petición de red.

Cumplimiento de estándares: El estándar HTML living standard prohíbe explícitamente esta combinación. Los validadores lo marcan porque casi siempre indica un error — ya sea que se aplicó el type incorrecto, o el atributo src fue añadido por accidente.

Mantenibilidad: Los desarrolladores futuros que lean el código pueden confundirse sobre si el script se supone que debe ejecutarse o servir como un bloque de datos inerte. Mantener el marcado válido hace que la intención sea clara.

Cómo solucionarlo

1. Elimina el atributo type completamente. Este es el mejor enfoque para JavaScript clásico. El comportamiento por defecto es text/javascript, así que no se necesita type.
2. Usa type="module" si el script utiliza sintaxis de módulo ES (import/export).
3. Si pretendías un bloque de datos (ej., incrustar JSON o una plantilla), elimina el atributo src y coloca el contenido en línea dentro del elemento <script> en su lugar. Los bloques de datos con tipos que no sean de JavaScript no pueden usar src.

Ejemplos

Inválido: tipos que no son de JavaScript con src

Todos estos activan el error de validación porque el valor de type no es un tipo MIME de JavaScript, una cadena vacía, o "module":

<script type="text/html" src="template.html"></script>

<script type="application/json" src="data.json"></script>

<script type="text/plain" src="app.js"></script>

<script type="wrong" src="app.js"></script>

Válido: omitir el atributo type

La solución más simple y recomendada para scripts clásicos — simplemente elimina type:

<script src="app.js"></script>

Válido: usar un tipo MIME de JavaScript

Esto es válido pero redundante, ya que text/javascript es el valor por defecto. El validador puede sugerir omitirlo:

<script type="text/javascript" src="app.js"></script>

Válido: usar type="module"

Usa esto cuando el script externo utilice sintaxis de módulo ES:

<script type="module" src="app.js"></script>

Válido: usar un atributo type vacío

Una cadena vacía se trata como el valor por defecto. Es válido pero innecesario, y el validador puede sugerir eliminarlo:

<script type="" src="app.js"></script>

Válido: bloques de datos sin src

Si necesitas un type que no sea de JavaScript para un bloque de datos en línea, elimina el atributo src y coloca el contenido directamente dentro del elemento:

<script type="application/json" id="config">
  {
    "apiUrl": "https://example.com/api",
    "debug": false
  }
</script>

Encuentra problemas como este automáticamente

Rocket Validator escanea miles de páginas en segundos, detectando problemas de HTML en todo tu sitio web.

Iniciar prueba gratuita Ver precios