2

El problema consiste en que al importar una función de un archivo no sale ningún error pero no ejecuta el código del archivo pruebas.js.

Código pruebas.js

import borrar from borrar.js

const boton = document.createElement('button')
boton.type = 'button'
boton.innerText = 'Borrar elemento'

boton.onclick = function() {
    borrar()
}

document.body.appendChild(boton)

Codigo borrar.js

function borrar() {
    return
}

Codigo archivo.html

<!DOCTYPE html>

<html>
    <head>
        <title>Configurar elementos</title>
    </head>

    <body>
        <script type="module/javascript" src="pruebas.js"></script>
        <script type="module/javascript" src="borrar.js"></script>

        <button id="crear_elementos">Crear elementos</button>
    </body>
</html>

1 respuesta 1

3

Tenes varios errores.

  • Uso de type="module/javascript":
    El navegador desconoce dicho tipo, por lo que directamente ni descarga los archivos.

    La forma correcta sería utilizar type="module".

  • No es necesario incluir el script borrar.js en el HTML

  • Utilizar import:

    Una de las sintaxis para utilizar import es:

    import borrar from './borrar.js'
    

    Y para poder utilizar import como lo indico, el método que va a ser importado debe ser export default:

    export default function borrar() {...}
    

Solución:

Para que funcione, tu código final podría ser el siguiente:

archivo.html

<!DOCTYPE html>
<html>

<head>
  <title>Configurar elementos</title>
</head>

<body>
  <button id="crear_elementos">Crear elementos</button>

  <script type="module" src="pruebas.js"></script>
</body>

</html>

prueba.js

import borrar from './borrar.js'

const boton = document.createElement('button')
boton.type = 'button'
boton.innerText = 'Borrar elemento'

boton.onclick = function () {
  borrar()
}

document.body.appendChild(boton)

borrar.js

export default function borrar() {
    return '';
}

Referencias:

2
  • me salta el siguiente error Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/plain". Strict MIME type checking is enforced for module scripts per HTML spec. '' y cuando cambio module por "text/plain" sigue sin funciunar
    – patata
    Commented el 25 dic. 2022 a las 15:58
  • la solución esta en convertir los archivos js a mjs
    – patata
    Commented el 25 dic. 2022 a las 18:47

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.