Hace poco tenía Toastr llamándolo desde el atributo onlick
en mi botón así:
<button onclick="toastr.info('Proceso correcto', 'Gracias!');">
Y en un archivo externo de JavaScript con este código:
toastr.options = {
"closeButton": false,
"debug": false,
"newestOnTop": false,
"progressBar": false,
"positionClass": "toastr-top-right",
"preventDuplicates": true,
"onclick": null,
"showDuration": "300",
"hideDuration": "1000",
"timeOut": "1100",
"extendedTimeOut": "1000",
"showEasing": "swing",
"hideEasing": "linear",
"showMethod": "fadeIn",
"hideMethod": "fadeOut"
};
Pero leí que hacerlo de esa forma era una mala práctica, así que buscando cómo reemplazarlo logré hacerlo de esta forma:
document.getElementById("terminado").addEventListener("click", toastnativo);
function toastnativo() {
toastr.options = {
"closeButton": false,
"debug": false,
"newestOnTop": false,
"progressBar": false,
"positionClass": "toastr-top-right",
"preventDuplicates": true,
"onclick": null,
"showDuration": "300",
"hideDuration": "1000",
"timeOut": "1100",
"extendedTimeOut": "1000",
"showEasing": "swing",
"hideEasing": "linear",
"showMethod": "fadeIn",
"hideMethod": "fadeOut"
};
toastr.info('Proceso correcto', 'Gracias!');
}
Todo funciona bien, pero quiero saber si lo estoy haciendo de la forma correcta y si no supone algún problema para mi sitio.
$("#terminado").on("click", toastnativo);
terminado.addEventListener("click", toastnativo)
ya queterminado
es una variable autogenerada en el ámbito dewindow
al ser elid
de un elemento del DOM. Es decir, no es necesario hacer undocument.getElementById("terminado")
cuando estás en el ámbito dewindow
, y si estás fuera de él puedes seguir accediendo a ese valor a través dewindow.terminado
pwindow["terminado"]
. Hacer uso de$("#terminado")
es una sobrecarga de ejecución de código completamente innecesaria.options
va a ser siempre la misma, podrías hacerlo una única vez fuera del manipulador de eventos.