Question

我知道如何将图像附加到已知标签。 e.g。

//html
<div class="ImageContainer"></div>    

//JS
var image = new Image;
image.src = '/Public/Images/image.png';
image.appendTo($('.ImageContainer'));

但是如何找到某个标签（这里的数字标签）并附加图片？

我可以使用＆＃39; .find（）＆＃39;：

找到数字标签

var ImageContainer = $('<div><figure></figure></div>').
console.log(ImageContainer.find('figure').html());

但无法将图像附加到其中：

image.appendTo(ImageContainer.find('figure')); //doesn't work

Answer 1

如果你有一个带有id的图像元素，你可以选择它：

var $image = '<img src="/Public/Images/image.png" />';

然后找到图元素：

$(ImageContainer).find('figure').append($image);

Answer 2

尝试以下代码。

1）以变量名$ img。

存储图像网址

2）使用类名'image'（$（'。image'））

找到div

3）附加图像到div

<强> HTML

<div class="image"> </div>

<强> JS

var $img = '<img src="https://skypeblogs.files.wordpress.com/2013/05/skype-button.png"/>';

$('.image').append($img);

<强> JSFIDDLE DEMO

Answer 3

如果您使用的是jquery，则可以执行

var htmlString = '<div><figure><img src="some image src" /></figure></div>';
$('#ImageContainer').html(htmlString);

但是如果你想分别插入div / figure和image，那么你最好给它一些标识符，即

var htmlString = '<div><figure id="myFig"></figure></div>';
$('#ImageContainer').html(htmlString);
$('#myFig').html('<img src="" />');

找到一个元素并附加图像

3 个答案: