Como colocar para dar um clique e o programa guardar a informação de qual imagem clicou em java script ? E também dar um clique e mudar a imagem?

Bom dia, para a função de trocar a imagem a cada clique, o problema resolvido encontra-se aqui: https://forum.imasters.com.br/topic/335495-resolvido%C2%A0cada-clique-alterar-imagem/. Já para que o programa reconheça e guarde qual imagem clicou, você pode criar contadores do tipo inteiro que receberam somente a ação convertida em valor numérico, assim saberá quantas vezes foi clicada, e para saber qual a imagem, um outro contador que pode assumir números significando imagens, ou então que assumem o próprio nome da imagem.

Como colocar para dar um clique e o programa guardar a informação de qual imagem clicou em java script ? E também dar um clique e mudar a imagem?

#java script#Algoritimos e estruturas de da

Para a resolução desta tarefa foram utilizados conhecimentos sobre Java Script.

Para guardar informações de uma imagem, usamos a função getElementById, para selecioná-la, segue exemplo abaixo de acesso para salvar o título da imagem, que teria seu id igual a “img”, numa variável:

Document.getElementById('img').addEventListener('click', function(event){

var titulo = this.title;

});

Já para mudar a imagem podemos apenas usar uma jQuery, que é bem simples de fazer, segue exemplo da mudança de uma imagem do Facebook para uma do YouTube.

HTML:

<img src="https://icon-icons.com/icons2/478/PNG/128/youtube_47003.png" id="img">

jQuery:

$(document).ready(function(){

var img = $("#img");

img.on('click', function(){

var src = ($(this).attr("src") === "https://icon-icons.com/icons2/478/PNG/128/youtube_47003.png") ? "https://icon-icons.com/icons2/478/PNG/128/facebook_47004.png" : "https://icon-icons.com/icons2/478/PNG/128/youtube_47003.png";

$(this).attr("src", src);

});

});

Basicamente, foi criada uma variável para receber o nome do elemento e com ela, atribuímos o evento de "click", dentro deste evento, foi criada outra variável para armazenar o valor src, com uma condição de IF Ternário, que resume em apenas uma linha a cadeia de IF normal.

Para salvar informações de uma imagem podemos usar a função getElementById, já para mudarmos uma imagem para outra podemos usar uma jQuery bem simples de ser implementada.

Para a resolução desta tarefa foram utilizados conhecimentos sobre Java Script.

Para guardar informações de uma imagem, usamos a função getElementById, para selecioná-la, segue exemplo abaixo de acesso para salvar o título da imagem, que teria seu id igual a “img”, numa variável:

Document.getElementById('img').addEventListener('click', function(event){

var titulo = this.title;

});

Já para mudar a imagem podemos apenas usar uma jQuery, que é bem simples de fazer, segue exemplo da mudança de uma imagem do Facebook para uma do YouTube.

HTML:

<img src="https://icon-icons.com/icons2/478/PNG/128/youtube_47003.png" id="img">

jQuery:

$(document).ready(function(){

var img = $("#img");

img.on('click', function(){

var src = ($(this).attr("src") === "https://icon-icons.com/icons2/478/PNG/128/youtube_47003.png") ? "https://icon-icons.com/icons2/478/PNG/128/facebook_47004.png" : "https://icon-icons.com/icons2/478/PNG/128/youtube_47003.png";

$(this).attr("src", src);

});

});

Basicamente, foi criada uma variável para receber o nome do elemento e com ela, atribuímos o evento de "click", dentro deste evento, foi criada outra variável para armazenar o valor src, com uma condição de IF Ternário, que resume em apenas uma linha a cadeia de IF normal.

Para salvar informações de uma imagem podemos usar a função getElementById, já para mudarmos uma imagem para outra podemos usar uma jQuery bem simples de ser implementada.