小程序富文本插件（本文档动态更新，建议加星收藏）

新版文档链接：Parser插件文档

• 支持解析 style 标签中的全局样式
  支持解析和匹配 style 标签中的样式

  <parser html="{{html}}" />

  data:{
    html:'<style>.a{font-style:italic}#b{font-weight:bold}p{text-align:center}</style>'
  	  +'<p><span class="a">Hello </span><span id="b">World!</span></p>'
  }

• 支持自定义默认的标签样式
  支持给各个标签设置默认的效果
  示例（给表格设置默认的边框）：

  <parser html="{{html}}" tag-style="{{tagStyle}}" />

  data:{
    tagStyle:{
      table: 'border-collapse:collapse;border-top:1px solid gray;border-left:1px solid gray;',
      th: 'border-right:1px solid gray;border-bottom:1px solid gray;',
      td: 'border-right:1px solid gray;border-bottom:1px solid gray;'
    }
  }

• 支持多资源加载
  支持在 video 和 audio 标签中设置多个 source 标签，本插件将按顺序进行加载，若前面的链接无法播放，将自动切换下一个链接进行加载和播放，直到最后一个链接；可用于解决平台差异，最大程度避免无法播放

  <video controls>
    <source src="demo1.mov" />
    <source src="demo2.webm" />
  </video>

更多功能可见：功能介绍

1. 下载 Parser 文件夹至小程序目录
2. 在需要引用的页面的 json 文件中添加（百度小程序中组件名一定要小写）

   {
     "usingComponents": {
       "parser":"/Parser/index"
     }
   }

3. 在需要引用的页面的 wxml 文件中添加

   <parser html="{{html}}" />

4. 在需要引用的页面的js文件中添加

   data: {
     html:"<div>Hello World!</div>"
   }

• demo/wx 文件夹下的是微信小程序 富文本插件 示例程序的源码，可供参考

• 使用 uni-app 包（可以编译到所有小程序平台）
  1. 下载 Parser.uni 包到 components 目录下（更名为 Parser）
  2. 在需要使用页面的 vue 文件中添加

     <template>
       <view>
         <parser :html="html"></parser>
       </view>
     </template>
     <script>
     import parser from "@/components/Parser/index"
     export default{
       components: {
         parser
       },
       data() {
         return {
           html: '<div>Hello World!</div>'
         }
       }
     </script>

  • 可以直接通过插件市场引入：插件市场
  • demo/uni-app 文件夹下是一个示例程序，可供参考

其他框架中使用可见：在其他框架中使用

详细可见：组件属性

详细可见：回调函数

如果需要使用一些固定的样式，可以通过wxss / css文件引入
在/Parser/trees/trees.wxss(css)中通过@import引入自定义的样式文件即可

/*
* Parser/trees/trees.wxss(css)
* 在这里引入您的自定义样式
*/
@import "external.wxss(css)";

更多信息可见：使用方法

patches文件夹中准备了一些补丁包，可根据需要选用，可以实现更加丰富的功能
具体信息见：补丁包

富文本插件	多么生活	SteamCN 蒸汽动力论坛

恋爱宝典xcx	恋爱宝典（QQ）

欢迎添加：链接

  本插件提供了一个配套的后端node.js支持包，可以提供更加强大的功能，如匹配多层的style，代码高亮，直接打开网址，解析markdown等，其返回值可以直接作为本组件的html属性的值；且在后端提前完成解析后可以节省解析时间，提高性能。
注意：该包需要node.js v7.6.0以上运行环境，无法直接在小程序前端使用，建议部署在服务器或云函数上

详细文档参考： npm链接

• 许可
  您可以随意的使用和分享本插件 MIT License
• 支持
  

• 2019.12.21

  1. F 修复了使用 font 标签的 size 属性报错的问题 详细

• 2019.12.15:

  1. A 增加 setContent 的 api，用于设置 string 类型的数据，可以减少一次 setData 详细
  2. A 增加 imgList 的 api，可以获取封面、设置缩略图等 详细
  3. U a 标签支持了 app-id 和 path 属性，可以跳转其他小程序（需要在 app.json 中配置跳转名单）
  4. U domain 属性支持自动补全 css 中 url 的路径
  5. U cache-id 属性更名为 use-cache，只用选择是否使用缓存即可，缓存 id 会自动通过 hash 函数获取
  6. U html 属性传入 array 类型时即使没有设置 continue，组件也会自动进行设置（即可以传入和 rich-text 完全相同的格式）详细
  7. U 所有内置样式选择器名改为以下划线开头，避免与自定义样式的选择器冲突
  8. U document 补丁包增加 getStyle 和 setStyle 方法（返回值格式有更改） 详细
  9. D 废弃了 html 属性的 object 类型，请直接将 html 设置成原 object.nodes（即 array 类型，imgList 等其他信息可直接从 nodes 中获取） 详细
  10. D 删除了 animation-duration 属性，需要修改动画时长的，可直接在 index.js 中修改
  11. D 不再对百度版插件包进行维护，如有需要可从过去版本获取

• 2019.12.10:

  1. A 增加了 cache-id 属性，可以将解析结果缓存到 globalData 中，多次打开不用重复解析 详细
  2. A 增加了 getText 的 api，可以获取到一个富文本中的所有文本内容 详细
  3. A 增加了 getVideoContext 的 api，可以获取到视频的 context 对象，用于操作播放状态 详细
  4. A 增加了 highlight 代码高亮处理接口 详细
  5. A 增加了长内容的解决方案 详细
  6. U 重构了解析脚本，提高了解析速度，减小了包的大小
  7. U 解决了微信最新版开发者工具会报 wx:key="" does not look like a valid key name 的警告的问题
  8. U error 回调将返回该视频的 context 对象，可以修改播放源 详细
  9. F 修复了 uni-app 包编译到 H5 时在微信内置浏览器中无法显示、存在多个 parser 标签时相互覆盖等问题 详细

  此版本较之前版本在 api 和补丁包的引入方式上有不兼容的地方，请注意

• 2019.12.3:

  1. A 增加了 domain 属性，可以设置主域名，设置后对于图片链接将自动拼接上主域名或协议名 详细
  2. A 增加了 use-anchor 属性，可以设置页面内锚点 详细
  3. U CssHandler 补丁包增加支持 before 和 after 伪类

• 2019.11.29:

  1. U linkpress, imgtap 回调中增加一个 ignore 函数，在回调中调用此函数将不自动进行链接跳转/图片预览操作，可以屏蔽指定的链接/图片或进行自定义操作 详细

• 2019.11.28:

  1. U table 标签支持了 border, cellpadding, cellspacing 属性 详细
  2. U 重构了 uni-app 包编译到 H5 时的显示方式，采用 html 原生的标签渲染，实现了以下优化（仅针对 H5 平台，其他不变）：
     • 支持所有浏览器支持的标签和属性
     • style 标签支持所有浏览器支持的选择器
     • error 回调增加支持 img，且返回组件的 DOM 实例，修改属性后可以直接对页面生效
       另外，通过一些转换，原来的属性和事件依然全部支持（不再有 parser 回调，因为不进行解析）

更多可见：更新日志