Ссылка на изображение, созданное в JavaScript

Question

Я пытаюсь сгенерировать ссылку на мое изображение, сгенерированное javascript.

<div id="wrapper"></div> 
  <script type="text/javascript"> 
    var divWrapper = document.getElementById('wrapper');
    var image = document.createElement('img'); 
    image.src = 'image.png'; 
    image.height = 100; 
    image.width = 50; 
    image.style.position = "absolute";         
    image.style.left = 60 + "px";         
    image.style.top = 32 + "px";  
    document.write("<a href="index.php">); //HERE MIGHT BE THE MISTAKE
    divWrapper.appendChild(image);
  </script>`

Может кто-нибудь помочь мне с этим?Заранее спасибо

Answer 1

Не используйте document.write().Создайте новый элемент, как вы создали изображение, и добавьте изображение к элементу привязки, а элемент привязки к оболочке.

//define elements
var divWrapper = document.getElementById('wrapper');
var image = document.createElement('img');
var a = document.createElement('a');

//set image attributes
image.src = 'image.png';
image.height = 100;
image.width = 50;
image.style.position = "absolute";
image.style.left = 60 + "px";
image.style.top = 32 + "px";

//set anchor attributes
a.href = "index.php";

//Append the elements
a.appendChild(image);
divWrapper.appendChild(a);

<div id="wrapper"></div>

Также кавычка неверна в document.write("<a href="index.php">); это должно было быть document.write("<a href=\"index.php\">");, потому что вам нужно экранировать двойные кавычки, если вы используете их внутри строки, определенной с помощьюдвойные кавычки.