微慕小程序是資訊、媒體類小程序,因為對富文本內容和媒體內容的顯示有較高的需求。對於富文本解析，微慕小程序以前采用的開源的wxParse組件，不過wxParse組件存在很多的問題且已經停止維護支持，隨着微慕小程序功能不斷的增加和優化，wxParse組件已經無法適應，同時對wxParse二次開發優化的難度比較大，基於此微慕團隊考慮尋找更合適的解析組件，經過朋友的推薦和我們的考察，最終選擇開源組件：mp-html(https://jin-yufeng.gitee.io/mp-html)，這個組件堪稱小程序富文本解析利器。微慕團隊對mp-html組件二次開發后可以與微慕小程序完美兼容，微慕小程序專業版v3.8.0加入了該組件。mp-html組件給富文本的內容提供了不少出色的功能。
全面支持html標簽
小程序大多數都是基於html標簽來渲染和顯示內容的，mp-html組件支持以下列表標簽和屬性，同時支持id、style、class、align、height、width 屬性。幾乎可以完美兼容html的標簽內容，並保持web內容和小程序內容在顯示上兼容性，頁面渲染的性能很強。
| 標簽 | 屬性 |
|---|---|
| a | href |
| abbr | |
| address | |
| article | |
| aside | |
| audio | author, controls, loop, name, poster, src |
| b | |
| base | href |
| big | |
| blockquote | |
| body | |
| br | |
| caption | |
| center | |
| cite | |
| code | |
| col | span |
| colgroup | span |
| dd | |
| del | |
| div | |
| dl | |
| dt | |
| em | |
| embed | autostart, loop, src, type |
| fieldset | |
| font | color, face, size |
| footer | |
| h2 | |
| h2 | |
| h3 | |
| h4 | |
| h5 | |
| h6 | |
| head | |
| header | |
| hr | |
| html | |
| i | |
| img | ignore, original-src, src |
| ins | |
| label | |
| legend | |
| li | |
| mark | |
| nav | |
| ol | start, type |
| p | |
| pre | |
| q | |
| rt | |
| ruby | |
| s | |
| section | |
| small | |
| source | src |
| span | |
| strike | |
| strong | |
| style | |
| sub | |
| sup | |
| table | border, cellpadding, cellspacing |
| tbody | |
| td | colspan, rowspan |
| tfoot | |
| th | colspan, rowspan |
| thead | |
| tr | |
| tt | |
| u | |
| ul | |
| video | autoplay, controls, loop, muted, poster, src |
組件對html標簽支持的穩定性很好：
1.標簽名中可以含有 : 等特殊字符（如 o:p）
2.標簽名和屬性名大小寫不敏感
3.屬性值可以不加引號、加單引號、加雙引號，也可以卻缺省（默認 true）
4.屬性之間可以沒有空格（通過引號划分）、有空格（可以多個）、有換行符
5.支持正常格式、CDATA 等多種形式的注釋
同時，對於一些錯誤情況，程序也能夠自動處理：
1.標簽首尾不匹配
2.屬性值中冒號不匹配
3.標簽未閉合
自定義樣式配置
樣式（css）是富文本中最重要的內容之一，組件提供多種樣式設置的方法，可以進行靈活的自定義設置，讓小程序端的文本顯示更豐富。
1.行內樣式
這是最常用的樣式設置方法，直接將需要的樣式放在對應標簽的 style 屬性中即可，這種方式僅作用於單個標簽，優先級最高
2.tag-style
這是本組件獨有的一種樣式設置方式，可以給某一種標簽名設置默認的樣式，可以通過 tag-style 屬性設置，具體用法見對應說明
3.外部樣式
如果希望將某些樣式固定的用於渲染，可以添加到 tools/config.js 的 externStyle 字段中，該方法僅支持 class 選擇器（2.1.0 版本起支持標簽名選擇器），優先級最低。
需要調整優先級時，可以通過設置 !important 實現。
另外，通過引入 style 插件，還可以實現匹配 style 標簽中樣式的功能。
圖片加載
在富文本內容里圖片顯示非常重要，mp-html在圖片顯示上充分考慮小程序的特點，主要提供一下功能：
1。占位圖
支持設置圖片未加載完成時的占位圖 loading-img 和加載出錯時的占位圖 error-img
2.懶加載
內容較長、圖片較多時，開啟懶加載有助於改善性能，需要時可通過 lazy-load 屬性開啟
3.自動預覽
圖片被點擊時，將自動放大預覽，如不需要，可通過 preview-img 屬性關閉。還可以在 imgtap 事件中進行自定義處理
自動預覽通過特定的處理，可以實現左右滑動查看所有圖片、預覽重復鏈接不錯位等效果
4.預覽高清圖
同一張圖片，可以給顯示時和預覽時設置不同的鏈接地址以達到最佳效果
設置方式 1：給 img 標簽增加一個 original-src 即可
設置方式 2：通過 imgList 的 api 進行設置
5.長按彈出菜單
微信和百度平台支持圖片長按時彈出菜單，可以進行保存、分享等操作，如不需要，可通過 show-img-menu 屬性關閉
6.裝飾圖片處理
有時對於一些小的裝飾性圖片，可能不希望產生上述效果，此時可以給 img 標簽設置 ignore 屬性，將屏蔽預覽、彈出菜單等操作，提升體驗。
在鏈接內的、src 為 data url 且沒有設置 original-src 的圖片，默認為不可預覽的小圖片。
7.支持原大小顯示
本組件通過合理轉換，基本實現了和 html 中 img 的相同效果：沒有設置寬度時按原大小顯示；設置了寬度時按比例縮放；同時設置寬高時按設置的值顯示。不必去考慮小程序中的 mode 等問。。
8.支持 svg
雖然小程序中不支持 svg 系列標簽，本組件通過在解析過程中轉為 data url 圖片的方式實現了 svg 的顯示。
表格和列表
小程序中沒有 table 標簽，使得顯示表格一直是一個難題，mp-html解決了這個問題，並支持獨立橫向滾動，支持含有合並單元格的表格，常用表格屬性(border, cellspacing, cellpadding, align).
組件主要通過以下三種方式顯示表格
| 顯示方式 | 適用情況 | 說明 |
|---|---|---|
| rich-text 標簽 | 表格內部沒有鏈接、圖片等特殊標簽 | 效果最佳，幾乎不需要進行轉換 |
| table 布局 | 表格內有特殊標簽但沒有使用合並單元格 | 需要進行一定轉換，將 table, tr, td 等標簽轉為對應的布局 |
| grid 布局 | 表格內有特殊標簽且使用了合並單元格 | 需要進行復雜的轉換將合並單元格用 grid 布局表現出來 |
對於列表支持也非常友好，完全兼容html里的列表。
1.支持多層嵌套
支持嵌套多層列表，對於無序列表，不同的層級會顯示不同的黑點格式。
2.支持多種有序列表格式
通過設置 ol 標簽的 type 屬性，可以顯示數字、字母、羅馬數字等多種形式的標號。
3.支持不顯示標號
支持通過設置 list-style:none 的方式不顯示 li 標簽開頭的標號。
支持音頻和視頻
對於音頻和視頻支持自動暫停、多源加載、自動添加控件。
1.自動暫停
在存在多個視頻的情況下，同時播放可能會影響體驗，本組件支持在播放一個視頻的時候自動暫停其他所有視頻，如不需要，可通過 pause-video 屬性關閉
音頻在引入 audio 插件后也可以實現此效果
2.多源加載
不同平台支持播放的格式不同，只設置一個 src 可能會出現兼容性問題導致無法播放，因此本組件支持像 html 中一樣給 video 和 audio 設置多個 source，將按照順序進行加載，直到可以播放，最大程度上避免無法播放
3.自動添加控件
對於既沒有設置 controls 也沒有設置 autoplay 的標簽將自動把 controls 屬性設置為 true，避免無法播放，影響體驗。
支持多個平台的小程序
支持小程序包括:微信小程序,qq小程序，百度小程序，支付寶小程序，頭條小程序