Question

我正在尝试加载名为“鼹鼠”的图像。使用jQuery .load方法，但我不确定这是否是正确的方法或是否只有语法错误。非常感谢您的任何反馈。

<script>
    $(document).ready( function() {
    $('#mole').load(<img id="mole" src="img/mole.jpg" />);
    });                                                                                             

</script>

Answer 1

load是AJAX GET的简写，它立即被附加到目标元素。您要做的只是将图像添加到#mole。这里不需要AJAX。

$('<img id="mole" src="img/mole.jpg" />').appendTo('#mole');

Answer 2

<强> .load（）

从服务器加载数据并将返回的HTML放入匹配的元素中。

来源： jQuery API Documentation

我认为简单的追加（）更适合您的目的。

$("#mole").append('<img id="mole" src="img/mole.jpg" />');

注意

您的网页上似乎已经有#mole元素，您不应该插入具有相同ID的新元素。 ID属性应该是唯一的。

<强> Fiddle

Answer 3

.load()适合从服务器异步加载HTML并将其插入匹配的元素中。虽然您可以使用此方法，但似乎使用.append()或.html()会更适用于这种情况。

$('#mole').append('<img id="mole" src="img/mole.jpg" />')

OR

$('#mole').html('<img id="mole" src="img/mole.jpg" />')

请注意，使用.html()将替换#mole内的所有HTML，而.append()只会附加到已存在的任何内容的末尾。

尝试使用jQuery .load方法添加图像

3 个答案: