我可以使用CSS或JavaScript在新的全尺寸窗口中打开缩略图吗

Question

我使用的应用程序(WebWorks 2020.1(在发布到DHTML时会自动从我的FrameMaker源输入中生成<img>标记。我不能直接编辑HTML<img>或<a>标记，只能编辑附加样式表中的HTML页面ASP模板和CSS类。以下是生成的带有周围代码的图像输出：

<div class="picture">
<a name="628774">
<img class="Anchored_Frame" src="images/CreateWarehouse_thumb_7.png" style="display: inline; left: 0.0pt; max-height: 51px; max-width: 400px; top: 0.0pt" alt="" title="" usemap="#uGbGKlB3y6o_625462" width="100%" border="0">
<map name="uGbGKlB3y6o_625462"><area coords="0,0,400,51" shape="rect" href="images/CreateWarehouse_7.html" alt="" title=""></map>
</a>
</div>

DHTML输出将与一个web应用程序集成，该应用程序在显示的产品页面中的450像素宽的窗格中打开上下文相关的帮助。图像在DHTML页面中显示为400px的缩略图，如上面的代码所示。

我已经能够在点击时打开图像，但它会在相同的浏览器窗口(帮助窗格(中打开，该窗口限制为450像素，因此不会扩展图像。(随着浏览器窗口的放大，图像会做出响应并变得更大，但这在450像素的窗格中是不可能的。(当用户点击图像时，我希望它打开一个新的全尺寸浏览器窗口或选项卡。

我可以在页面模板中添加一个JS脚本。我可以添加/编辑CSS样式，如img。Anchored_Frame。有没有办法在新的全尺寸浏览器选项卡或窗口中仅使用CSS或JavaScript打开缩略图请记住，我不能直接编辑<a>或<img>标签。感谢你对新手的帮助。

Answer 1

如果你得到了与你在问题中显示的所有图像相同的结构：

<div class="picture">
<a name="">
<img>
<map>
</a>
</div>

这应该有效：

var images = document.getElementsByClassName('picture')
for(var i = 0 ; i < images.length; i++){ 
images[i].childNodes[1].childNodes[3].setAttribute("target", "_blank");
}

这个想法是添加到<map>target="_blank"