Как картинке добавить ссылку с помощью JavaScript?

Question

[Михаил]

Всем привет! подскажите пожалуйста, как Картинкам добавить ссылку с помощью JavaScript ? Есть Картинки и надо сделать чтобы при клике на них был переход по ссылке. Как это можно сделать ? В верстку добавить теги A не могу.
Вёрстку менять не могу
Картинок много. Для всех картинок одна и та же ссылка должна быть

Comments

[alex-1917]

а зачем эта фишка нужна?

Answer 1

[Vadim Bogomazov]

$('img').on('click', () => {
	location.href = 'https://google.com';
});

Comments

[Михаил]

document.querySelector('.item-img').click(function() {
            window.location.href = https://google.com';
        });

а так могу написать ? если много картинок

[Дмитрий]

Михаил, Необходимо использовать querySelectorAll

[Vadim Bogomazov]

Михаил,

[Andrew]

Михаил, в js этот метод(.click()) имитирует клик, а не вешает на элемент обработчик

Answer 2

[John]

Прямое решение Вашего вопроса:
HTML:

<div id="myPicture">
<img src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" />
</div>

JS:

var a=document.createElement('a');
a.href='http://www.google.com';
var image = document.getElementById('myPicture').getElementsByTagName('img')[0];
b=a.appendChild(image);
document.getElementById('myPicture').appendChild(a);

Как избежать блокировку google browser не знаю, так как он такие скрипты подозрительными находит.

Альтернатива через таг html:

<a href="https://www.google.com">
<img border="0" alt="pic" src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" width="100" height="100">

Comments

[Михаил]

а это что-то я такое не видел еще , чтобы два подряд идентификатора
здесь в image что запишется ?

var image = document.getElementById('myPicture').getElementsByTagName('img')[0];

[Алексей Ярков]

Михаил, первый найденный тег img внутри тега с id="myPicture"

<div id="myPicture">
  <img src=""/> <!-- Вот этот тег найдет -->
  <img src=""/>
</div>