使用外部Javascript在HTML中显示带有链接的图像？

Question

我是javascript新手，并且尝试使用外部Javascript文件显示HTML中具有链接的其他图像。 我不完全确定这是可行的还是最好的解决方案。 我创建了以下脚本，打算将其放入相同的外部文件中。

var img1 = new Image();
img1.src = 'myimage.jpg';
img1.onclick = function() {
    window.location.href = 'mylink.html';
}; 
document.body.appendChild(img1);

和

var img2 = new Image();
img2.src = 'myimage.jpg';
img2.onclick = function() {
    window.location.href = 'mylink.html';
}; 
document.body.appendChild(img2);

我可以使用以下代码调用整个工作表，但不能调用单个脚本，因此我想知道是否可以从同一工作表调用单个脚本吗？ 我想避免创建多个.js文件。

<script src="js/myjavascript.js"></script>

Answer 1

在JavaScript文件中创建一些函数

function addImage1() {
  // some code
}

function addImage2() {
 // some more code
}

然后像往常一样包含JavaScript文件，然后在要添加图像时调用函数：

<script>
addImage1();
addImage2();
</script>

Answer 2

var a = document.createElement("a");  // <- <a> element (link)
a.href = "myfile.html";  // <- set link (href)
var myimage = document.createElement("image");  // <- image
myimage.src = "myimage.png";  // <- image source
a.appendChild(myimage);  // <- append image to <a> tag
document.body.appendChild(a);  // <- append <a> tag to body