我可以使用 jQuery 重新加载多个 div 吗？

Question

我目前正在尝试通过 class:

重新加载一些 div

jQuery(".avatar-wrapper").load(location.href + " .avatar-wrapper>*", "");

img {
  width: 80px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="avatar-wrapper">
  <img class="avatar" src="https://target.scene7.com/is/image/Target/GUEST_7f86ff7a-22f0-4556-997c-b6dc907a1940?wid=488&hei=488&fmt=pjpeg">
</div>

<div class="avatar-wrapper">
  <img class="avatar" src="https://target.scene7.com/is/image/Target/GUEST_7f86ff7a-22f0-4556-997c-b6dc907a1940?wid=488&hei=488&fmt=pjpeg">
</div>

我在一个页面上有多个具有相同 class 的元素，因此我希望所有元素都重新加载，但遗憾的是它不起作用。也许我需要直接参考，但最好的选择是一行代码。我有什么办法处理这个问题吗？

Answer 1

jQuery 的 .load() 将远程内容 加载到 页面元素中。 <img> 元素是 content-less 所以这是行不通的。您最好删除所有图片，然后用 $.post() 响应中的图片替换它们，例如

$.post(location.href).done(doc => {
  $('.avatar').remove()
  $(doc).find('.avatar').appendTo('#some-container-element')
})

或者，重新加载包裹图像的元素

$('#some-container-element').load(`${location.href} #some-container-element`, '')

我可以使用 jQuery 重新加载多个 div 吗？

Can I reload multiple divs with jQuery?

html

javascript

ajax

jquery

reload