Tengo este codigo que sirve para imprimir el outerHTML de un div, Proceso de ejecucion:
- detecto click en un elemento con atributo bt-print
- selecciono el div con atributo area-print basado en el bt-print
- creo, abro una ventana y le doy como html el outerHtml de mi div area-print
- al imprimir o cerrar la ventana de dialogo print cierro esta ventana
document.querySelector('[bt-print]').addEventListener("click",function(){
alert(1);
var divToPrint=document.querySelector('[area-print="'+this.getAttribute('bt-print')+'"]');
var newWin=window.open('','Print-Window');
newWin.document.open();
newWin.document.write('<html><body onload="window.print()">'+divToPrint.outerHTML+'</body></html>');
newWin.document.close();
});
<div area-print="hola">hola</div>
<div area-print="chau">chau</div>
<button bt-print="hola">Hola</button>
<button bt-print="chau">Chau</button>
Funciona bien con el primer bt-print, los demas no los detecta, puse el alert para ver si ejecuta almenos la funcion y nada mi pregunta es: como puedo seleccionar todos los elementos que contengan bt-print como atributo
Nota: intente con querySelectorAll pero es peor, no detecta ni el primer boton
Otra forma de preguntar seria: lo que deseo es obtener el mismo resultado que obtendria poniendo en jquery esto: $("[bt-print]").on("click",function(){ ... });
querySelector
te devuelve un htmlCollection, tendrás que recorrerlo, no te aparece algo en la consola?getElementById
, debe devolverte un array de esos selectors y te da error porque no específica cuál vas a usar.var divToPrint=document.querySelector('[area-print="'+this.getAttribute('bt-print')+'"]');
¿? Tu código es altamento sospechoso de una mala práctica o de un error de lógica.