使用javascript/jquery應用superscipt/subscript標記

我正在顯示來自MySQL數據庫的文本，內容類似於「測量痕量氣體CH4，N2O和CO2以及控制其生產和排放的過程」。文本通過文本區域保存。當文本顯示在HTML文檔中時，我想使用javascript/jquery將上標/下標應用於CH4，N20和CO2？請讓我知道這是否可能？使用javascript/jquery應用superscipt/subscript標記

來源

2012-12-03 webdevexp

您可以使用Unicode中的下標數字字符：CH₄，N₂O，CO₂。

你可以寫一個正則表達式匹配化學式（如：CH4），並使用標數字字符（CH 4）重新格式化。

你有兩個選擇：

商店從<textarea>在數據庫中的文本沒有任何格式化。然後，當您呈現HTML頁面時，請添加下標數字，無論是服務器端（例如：PHP）還是客戶端（例如：JavaScript）。
將文本寫入數據庫之前重新格式化文本。

一旦添加了下標數字，您需要確保從該點開始使用UTF-8字符集，以避免損壞字符。

來源

2012-12-03 12:33:02 TachyonVortex

此方法在工作時會產生印刷上最佳的結果，但由於字體問題可能無法工作。您需要使用包含下標數字的字體，這可能會大大限制選擇：http://www.fileformat.info/info/unicode/char/2084/fontsupport.htm –

最簡單的方法是處理數據，以便數字放在sub標記內，例如， CH4變成CH<sub>4</sub>。然而，這產生排印較差的結果（包括不均勻的行間隔），所以我建議生成CH<span class=sub>4</span>並使用CSS規則

.sub { 
    vertical-align: 0; 
    position: relative; 
    top: 0.8ex; 
    font-size: 80%; 
}

使用可調諧的值，當然，也許取決於字體。

其他選項包括使用下標字符（如@ TachyonVortex的答案中所建議的）並使用OpenType功能與font-feature-settings（受限瀏覽器支持，受限字體支持）進行下標。

來源

2012-12-03 14:21:53

我已經明確提到文本來自一個數據庫。我可能無法編寫CSS類的代碼。它必須動態完成。我需要搜索像CH4這樣的文本，然後將4作爲下標。 – webdevexp

當然，如果數據只是純文本，你需要識別應該下標的數字，例如在它們周圍生成適當的標記。這與選擇下標的標記或符號的問題是相互獨立的，並且取決於具體的數據（例如，緊跟在字母后面的任何數字序列或者閉合的括號是否作爲上標？）。 –

使用javascript/jquery應用superscipt/subscript標記

回答

相關問題