是否有可能通过JavaScript将所有的HTML图像变成链接？

我想通过外部js文件将每个<img>链接到自己（文件）。是否有可能通过JavaScript将所有的HTML图像变成链接？

我的思考过程是我可以定位所有img元素，然后抓取图像src并在img元素周围放置一个链接。例如：

谈到这一点：

<img width="281" vspace="7" hspace="5" height="215" align="left" alt="img1" src="cits/images/image001.jpg"></img>

进入这个：

<a href="cits/images/image001.jpg" target="_blank"> <img width="281" vspace="7" hspace="5" height="215" align="left" alt="img1" src="cits/images/image001.jpg"></img> </a>

它看起来像我可以抓住IMG SRC作为变量，以及找到IMG元素，但我不知道我如何能够在img上添加链接。

来源

2013-02-26 Eric

我会使用另一种方法：处理点击所有图像就好像它们是链接（使用'window.open'，如果你想让它们在单独的窗口中打开）。问题是，包装元素中的所有图像可能会破坏页面结构。 – raina77ow 2013-02-26 16:28:29

你使用jQuery吗？ – 2013-02-26 16:28:54

@ raina77ow听起来很容易，谢谢。我会留下这些，以避免任何人有更多的想法抛出或解决方案。 – Eric 2013-02-26 16:29:32

万一你正在使用jQuery

$('img').each(function(ix, image){ 
    $(image).wrap('<a target="_blank" href="' + $(image).attr('src') + '"></a>'); 
})

来源

2013-02-26 16:32:23 DanC

抓住所有的图像。

var images = document.getElementsByTagName('img');

编写替换新的标记，包括指向图像，其中包括图像的旧outerHTML的src属性的链接的图像的outerHTML的功能。

function makeLink(image){ 
    image.outerHTML = '<a target="_blank" href="' + image.src + '">' + image.outerHTML + '</a>'; 
}

遍历你的图像，并提交每个到makeLink功能。

for(var i = 0, l = images.length; i < l; ++i){ 
    makeLink(images[i]); 
};

来源

2013-02-26 16:33:57 Barney

如果你愿意使用jQuery，该代码非常简单：

$("img").each(function() { 
    $(this).wrap($("<a target='_blank'/>").attr("href", $(this).attr("src")); 
});

否则你得寻找到一个原料JavaScript解决方案，这是更复杂一点。见@巴尼的答案。

来源

2013-02-26 16:34:17 KaeruCT

是否有可能通过JavaScript将所有的HTML图像变成链接？

回答

相关问题