如何使用JavaScript编写代码，使得用户点击特定按钮时，能触发一个淡入动画效果并显示对应的图片？

在JavaScript中，你可以结合HTML、CSS和jQuery库来创建这种动态效果。首先，你需要有一个按钮和一张隐藏的图片。下面是一个简单的示例：

<button id="fadeButton">点击展示图片</button>
<img id="hiddenImage" style="display:none;" src="your-image-url.jpg" alt="Your Image">

<!-- Include jQuery library (假设已经引入) -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<script>
$(document).ready(function() {
  $('#fadeButton').click(function() {
    // 使用fadeIn动画显示图片
    $('#hiddenImage').fadeIn(500); // 动画持续时间为500毫秒
  });
});
</script>

在这个例子中，当用户点击id为`fadeButton`的按钮时，`#hiddenImage`图片会以淡入动画的方式从隐藏变为可见。`fadeIn()`函数是jQuery提供的，用于渐变地显示元素。