Anki 显示字段 html 代码

Anki 显示字段 html 代码

csdn上的文章无暇及时更新。如果对我的文章感兴趣，可以关注语雀或者公众号“IdleQuant”，及时获取文章（无需成为csdn会员）。

缘由

在 英语生词学习解决方案 一文中我分享了英语生词学习流程，其中提到了 fastWQ 这个用于批量生成卡片的插件。

一般来说，fastWQ生成的卡片样式基本能与原词典的样式一致，较为美观。但有时，词典的 css 以及 javascript 比较复杂时，fastWQ 未必能够很好转换，卡片样式可能不如之前美观，甚至有严重的问题。本文介绍一个能够非常方便查看字段 html 代码的插件，这样就能快速分析问题所在。

Show field’s source (html) in editor

Show field’s source (html) in editor - AnkiWeb 顾名思义，插件让你能在卡片编辑窗口直接查看具体字段的 html 代码。

比如在字典中，显示效果如下：

但是制卡后却变成了：

不仅自己显示不清楚，还影响到了其他字段。

安装该插件后，编辑窗口字段名称前多了 <src>：

点击 <src> 就会显示该字段的 html 代码：

把代码复制到代码编辑器即可进行分析：

<div class="_cambridge4">
    <link href="_cambridge4_wrap.css" rel="stylesheet" type="text/css">
    <script src="_cambridge_jquery.js"></script>
    <script src="_cambridge4.js"></script> <a name="sense_index_0"></a>
    <div class="cam-body">
        <div class="sense_index">
            <div class="contents" style="opacity: 1;">Contents</