Ajude o site desativando o bloqueador de anúncio

ASSINE A NEWSLETTER

Cadastrando...
PIX uDesenv pix deposito

Javascript com Modulo

Autor: Eurai Criado: 28/08/2021 Atualizado: 15/09/2021

 

Trago neste artigo a utilização de modulo em javascript.

É possível criar varios scripts e exportar funções e variáveis desejadas e no HTML podemos importar elas para utilização, definindo uma variável para associação.

No HTML importamos com a tag 

 

Arquivo Javascript (message.js) 

export const name = 'Eurai';

export function message(cMessage = 'Universo do Desenvolvedor') {
    alert(cMessage);
}
 

 

 

 

Estrutura dos arquivos

javascript-module-exemplo

 

Para implementar mais o exemplo, segue abaixo do Modulo com template string. No exemplo abaixo, foi utilizado o template String para montar um HTML de modal, é recebido os parâmetros de título e texto, é montado o html e retornado o mesmo para append.

A função é showModal, como é utilizado o template string, é possível criar com quebra de linha o template HTML.

 

Arquivo HTML (index.html)





    
    
    
    Module





    
Javascript Module

 

Arquivo Javascript (message.js) 

export const name = 'Eurai';

export function message(cMessage = 'Universo do Desenvolvedor') {
    alert(cMessage);
}

export function html() {
    return `
    
teste
`; } export function html2(cTexto = 'sem texto') { const cHtml = `
${cTexto}
`; return cHtml; } export function showModal(cTitulo = 'titulo', cTexto = 'sem texto') { const cHtml = `
${cTitulo}
${cTexto}
`; return cHtml; }

 

javascript-module-showmodal-modal 

javascript-module-showmodal-modal-function 

Gostou? Compartilhe com seus amigos e deixe um comentário! 😎

Um abraço, e até a próxima