Buenos días a toda la comunidad.
Tengo una función en Javascript
que lee datos desde JSON
y me trae unas imágenes. Estas imágenes las estoy mostrando en una página HTML
. Hasta ahora ningún problema; lo que no estoy logrando es encerrar estas imágenes dentro de un elemento <a>
ya que quiero que tengan un link.
Este es mi código JS.
<script>
var jsonData2 = '[{"idc":"8","ima":"exis.png","title":"EXIS","especialidades":"-1-2-3-4-5-6-9-10-11-12-13-14-16-17-18-19-20-22-23-24-25-26-27-28-29-34-35-36-"}]'
$(document).ready(function()
{
var data = JSON.parse(jsonData2);
var rowImg = document.getElementById("rowImg");
for (var i = 0; i < data.length; i++)
{
var object = data[i];
var img = document.createElement("img");
img.src = "images/" + object.ima;
img.id = object.idc;
img.class = "img-responsive";
img.title = object.title;
img.style = "width: 300px; height: 200px; margin: 0 auto";
img.appendChild(document.createTextNode(object.ima));
rowImg.appendChild(img);
}
});
</script>
Así es como queda en el HTML:
<div class="row" id="rowImg">
<img src="images/exis.png" id="8" title="EXIS" style="width: 300px; height: 200px; margin: 0px auto;"></img>
</div>
Esto es lo que estoy tratando de lograr:
<div class="row" id="rowImg">
<a href="#"><img src="images/exis.png" id="8" title="EXIS" style="width: 300px; height: 200px; margin: 0px auto;"></img></a>
</div>