實現 kindle 原生系統、多看系彈出注釋的通用寫法

　　入手 Kindle 后開始自己做 ePub，之前一直用原生系統，使用的彈出注釋代碼如下：

<p class="P_Footnote" id="ref_footnotebookmark_end_9_1"><span style=" font-size: 0.75em; vertical-align: super;"><a href="#ref_footnotebookmark_start_9_1">①</a></span>注釋的內容</p>

　　逐漸由於制作 ePub 的需要，我開始使用多看系統，這時候原生系統彈出注釋代碼失效，這樣就造成極大的不便——我必須制作兩個不同的 ePub 來適應系統切換。多看彈出注釋代碼如下：

<ol class="duokan-footnote-content">
    <li class="duokan-footnote-item" id="a_1_1"><a href="#c_1_1">這里是注釋</li>
</ol>

　　於是我開始尋求一種方法，使得彈窗注釋能支持原生和多看。上面的兩處代碼中可以發現，原生系統的彈窗注釋基於標簽<p>，而多看系統的彈窗注釋依賴於<ol>，於是我有一個思路，如果將兩個標簽嵌套使用，是否就能實現雙系統的彈窗呢？

　　一開始我將<p>嵌套在<li>中，將<p>嵌套在<a>中，代碼如下：

<ol class="duokan-footnote-content">
    <li class="duokan-footnote-item" id="a_1_1">
       <p><a href="#c_1_1">這里是注釋</a></p>
</li>
</ol>
<!--<p>嵌套在<li>-->

<ol class="duokan-footnote-content">
    <li class="duokan-footnote-item" id="a_1_1">
       <a href="#c_1_1"><p>這里是注釋</p></a>
</li>
</ol>
<!--<p>嵌套在<a>-->

　　然而這兩種方法在實際測試中都失效。不過在論壇壇友的指點下，找到了這么一種方法，代碼如下：

<ol class="duokan-footnote-content">
    <li class="duokan-footnote-item" id="ref_footnotebookmark_end_1_1">
      <p class="f"><a href="#ref_footnotebookmark_start_1_1">這里是注釋</a>​​&#8203;​​​​​​</p>
    </li>
  </ol>

 

P.S. "&#8203;"這個字串是 Zero-width space （ 零寬度非換行空格 ）

P.S.想要批量修改可以使用通配符，如下：

Search:<li class="duokan-footnote-item" id="(.*?)"><a href="#(.*?)">(.*?)</li>

Replace:<li class="duokan-footnote-item" id="\1"><p class="f"><a href="#\2">\3</a>&#8203;​​​​​​​​​</p>