让博客中的图片支持 fancybox 浏览
第1步，添加 jQuery 和 fancybox 文件
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
<script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
第2步，集成 fancybox, 为所有 img 元素添加父元素
$("img").not('#blogTitle img').not('#blog_nav_rss_image img').not('#green_channel_weibo img').not('#green_channel_wechat img').not('.author_profile_info img').each(function () {
var element = document.createElement("a");
$(element).attr("data-fancybox", "gallery");
$(element).attr("href", $(this).attr("src"));
$(this).wrap(element);
});
该代码用于向
<img>标签外嵌套 FancyBox 所要求的<a>标签。但由于该代码将 fancybox 应用于所有图片文件，包括图标、按钮等不希望应用的图片素材，因此需要修改.not()排除部分对象。
参考链接
http://fancyapps.com/fancybox/3/
