Javascript 这是最有效的方法吗？Jquery单击图像以更改imgsrc以及H1和p标记的文本

我试图通过jquery点击事件更改img src、标题1（H1）和的文本。 这是HTML

<a href="#AF">
<img id="AF1" src="image_url">
<span class="text-center">Dude 1 AF</span>
</a>

---

现在，这是预期的工作，但它有点慢（加载不同的图像），我必须重复这12次。我在问是否有更有效的方法来做到这一点？谢谢。

如果图像加载缓慢，您是否确实查看了图像文件及其大小？您可以在单击事件之前预加载图像

<img id="AF2_IMG" class="a-profiles-img" src="url_old" />
<h1 id="AF2_H1" class="text-center blue a-profiles-name">old_header</h1>
<p id="AF2_P" class="a-profiles-body">new_body</p>

$('#AF1').on({
'click': function(){
$('#AF2_IMG').attr('src','new_image');
        $('#AF2_H1').text('new_image_title')
        $('#AF2_P').text('new_body_text')
    }
});