2020-01-02_224004.pngTBS腾讯浏览服务： x5.tencent.com
微信tbs调试页面： debugtbs.qq.com （微信内打开）
X5内核调试页面： debugx5.qq.com （微信内打开）
ok，上一篇文章已经对img标签下手了。这次更彻底点，给图片添加上灯箱效果
2020-01-02_215330.png首先，引入相关js文件
<!--在header里添加这个-->
<link href="https://cdn.bootcss.com/fancybox/3.5.7/jquery.fancybox.min.css" rel="stylesheet">
<!--先加载jquery依赖-->
<script src="//cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
<!--fancybox的js，还是bootcdn-->
<script src="//cdn.bootcss.com/fancybox/3.5.7/jquery.fancybox.min.js"></script>修改Typecho
首先找到HyperDown.php文件,在Typecho下的var目录里。
然后搜索img，一般在349行开始，修改img标签为
<a data-fancybox=\"gallery\" href=\"{$url}\"><img src=\"{$url}\" alt=\"{$escaped}\" title=\"{$escaped}\"></a>
HyperDown.php文件位置正则替换，与上面方案任选其一
ps：这会导致 <!--more--> 无法正常截断文章。
2020-01-05 更新，修正 <!--more--> 无法正常截断文章的问题。
2020-02-09 跟新，正则表达式增加对atl和title属性的匹配。
首先在你的主题文件找到这个
<?php $this->content(); ?>用正则修改img标签
<?php
$pattern = '/\<img.*?src\=\"(.*?)\".*?alt\=\"(.*?)\".*?title\=\"(.*?)\"[^>]*>/i';
$replacement = '<a href="$1" data-fancybox="gallery" /><img src="$1" alt="$2" title="$3"></a>';
$content = preg_replace($pattern, $replacement, $this->content);
//需要支持截断的添加下面两行
$array=explode('<!--more-->', $content);
$content=$array[0];
echo $content;
?>今天，处理站点地图的时候，发现有个PageSpeed Insights工具，可以测试网站打开速度并提供改进建议。
2020-01-02_205807.png我这个网站的问题主要是图片太大，加载慢。
我觉得最可行的就是使用延迟加载（懒加载）的方式载入图片。
这次，我们使用基于jQuery的lazyload来实现懒加载。
注意：微信内X5内核加载失败！
2020-01-05 更新，代码问题修正，微信上生效需清理内置x5内核缓存
首先，引入相关js文件
<!--由于lazyload依赖于jquery所以要先加载-->
<script src="//cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
<!--lazyload的js，由于我用的是bootstrap，所以就用他家的cdn了-->
<script src="//cdn.bootcss.com/jquery_lazyload/1.9.7/jquery.lazyload.min.js"></script>
<!--使用 '//' 可以自动选择使用http还是https加载-->添加触发函数
<script type="text/javascript">
$(function() {
$("img").lazyload({
placeholder : "/loading.gif",
effect: "fadeIn"
});
});
</script>替换img标签
<img class="lazyload" src="/loading.gif" data-original="图片实际Url">其他设置
//图片距离屏幕200px时提前加载
jQuery("img").lazyload({ threshold : 200 });HTTP 使用统一资源标识符（Uniform Resource Identifiers, URI）来传输数据和建立连接。
HTTP 请求到服务器的请求消息包括以下格式：请求行（request line）、请求头部（header）、空行和请求数据四个部分组成。
HTTP1.0 定义了三种请求方法：GET,POST和HEAD方法。
HTTP1.1 新增了五种请求方法：OPTIONS,PUT,DELETE,TRACE和CONNECT方法。
GET：请求指定的页面信息，并返回实体主体。HEAD：类似于get请求，只不过返回的响应中没有具体的内容，用于获取报头POST：向指定资源提交数据进行处理请求（例如提交表单或者上传文件）。数据被包含在请求体中。POST请求可能会导致新的资源的建立和/或已有资源的修改。PUT：从客户端向服务器传送的数据取代指定的文档的内容。DELETE：请求服务器删除指定的页面。CONNECT：HTTP/1.1协议中预留给能够将连接改为管道方式的代理服务器。OPTIONS：允许客户端查看服务器的性能。TRACE：回显服务器收到的请求，主要用于测试或诊断。
