使用heic2any将HEIC格式图片展示在img标签

使用heic2any将HEIC格式图片展示在img标签的步骤如下：

1. 在HTML文件中添加img标签，如下所示：

<img id="heic-img" src="" alt="HEIC Image">

2. 在JavaScript代码中使用heic2any库将HEIC格式图片转换为base64编码的图片数据，然后将其设置为img标签的src属性，如下所示：

// 获取img标签
const img = document.getElementById('heic-img');

// 使用heic2any将HEIC格式图片转换为base64编码的图片数据
heic2any({
  // 指定要转换的HEIC格式图片的URL
  src: 'path/to/heic/image.heic',
  // 指定要转换的输出格式为JPEG
  toType: 'image/jpeg',
  // 指定转换完成后的回调函数
  onComplete: (result) => {
    // 将转换后的base64编码的图片数据设置为img标签的src属性
    img.src = result;
  }
});

3. 在CSS样式中设置img标签的宽度和高度，以确保图片正确显示，如下所示：

#heic-img {
  width: 100%;
  height: auto;
}

需要注意的是，使用heic2any将HEIC格式图片转换为base64编码的图片数据，可能会影响页面加载性能，特别是在处理大型图片时。因此，应该根据实际情况选择合适的解决方案。