使用uBlock Origin将知乎网页版表情显示为纯文字标签
2024/2/8 3:02:19
本文主要是介绍使用uBlock Origin将知乎网页版表情显示为纯文字标签,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
知乎表情的实现方式:贴图
知乎的表情事实上是一系列由方括号包裹的关键字标记的图片,和微信聊天中的表情类似。当我们将鼠标移到表情上时,就可以看到图片的alt
信息,即表情的关键字:
阻断图片加载
看起来,要想实现将知乎表情显示为纯文本标签,我们只需要阻断知乎网页对表情包图片的加载即可,那根据HTML
语法,图片的alt
属性就会显示在页面上,达到了我们的目的。经过F12开发者工具审查页面发现,这些图片和正文中出现的其他图片一样,都是从形如pic[0-9].zhimg.com
这样的域名下加载的,而一种明显的区分方法是这些表情图片是固定的png,对应的加载URL直接是https://pic[0-9].zhimg.com/v2-xxxxx.jpg
这样的形式,而其他的图片不论格式会有一个额外的source
参数,形如...?source=xxxx
。因此,我们可以使用uBlock Origin
这样的广告拦截插件,基于URL的匹配规则来特异性地阻断这些表情图片的加载。对应需要配置的过滤规则如下:
! 注释使用单个! ! uBlock Origin支持子串或EasyList语法的过滤规则 ||pic*.zhimg.com/*.png
然而,这样我们会惊奇地发现,知乎中的表情消失了,但是相应的alt
内容没有呈现,这相当于丢失了表情在文中的信息,肯定是不能接受的:
阻断事件监听器
继续深挖出现问题的HTML
段落,我们会注意到如下情况:
在源代码中,sticker
类图片对象被标记为灰色的,说明整体隐藏了,而它们都附有事件监听器,会不会是这些监听器在图片未成功加载时改变了图片的显示行为呢?我们注意到这些监听器的来源是https://unpkg.zhimg.com
,而这个域名似乎不承担其他的功能,那就可以大胆地继续配置规则把它们也阻断,观察效果:
! 这次使用子串匹配域名即可 unpkg.zhimg.com
这样就成功了,说明上述的监听器就是文字标签被隐藏的原因。个人对这种设计不太理解,因为文字标签就是用于在图片加载失败时显示以表示意义的,而不应该被隐藏。不过总之我们已经成功地将知乎表情显示为纯文本标签了。
本文由博客一文多发平台 OpenWrite 发布!
这篇关于使用uBlock Origin将知乎网页版表情显示为纯文字标签的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-07-16终于支持中文,开源手绘风格画板工具 Revezone 推荐!
- 2024-07-16好物期刊#1:我每天都使用的在线工具
- 2024-07-16OpenSearch 与 Elasticsearch:哪个开源搜索引擎适合您?
- 2024-07-16Easysearch 内核完善之 OOM 内存溢出优化案例一则
- 2024-07-16远程办公、企业内网服务器的Code-Server上如何配置使用CodeGeeX插件
- 2024-07-16一款好看好用 + 免费 AI 能力的终端工具推荐
- 2024-07-16安卓安装Magisk面具以及激活EdXposed
- 2024-07-16如何写出干净的GitCommit
- 2024-07-16如何看待腾讯 QQ 浏览器抄袭 Arc
- 2024-07-16INFINI Labs 助力开源与教育:免费许可证计划全面升级