### [小程序中页面兼容h5标签的解析](https://www.prosaas.cn/article/17152)

**Published:** 2018-08-10T08:49:20

**Author:** 5201314

**Excerpt:** 本篇文章给大家带来的内容是关于小程序中页面兼容h5标签的解析，有一定的参考价值，有需要的朋友可以参考一下，希望…

本篇文章给大家带来的内容是关于小程序中页面兼容h5标签的解析，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。

有时候当小程序向后台拿数据是一篇html标签的文章时，把它放进小程序会发现很多标签就不兼容，如果要一个个改又很麻烦，有没有方法可以很快地兼容html标签呢？  
有个工具可以做到：wxParse  
![](https://img-blog.csdn.net/20180807212127142?watermark/2/text/aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0FyaWVsXzIwMTMxMQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70)  
下载了它的压缩包后解压，复制wxParse文件夹放到小程序pages页面里：  
![](https://img-blog.csdn.net/2018080721230949?watermark/2/text/aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0FyaWVsXzIwMTMxMQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70)  
在wxml里引入，这里的路径仅供参考：

<import src="../../../../wxParse/wxParse.wxml" />//在需要放置html文本的地方使用wxParse组件 <view class='article\_bd'>
    <template is="wxParse" data="{{wxParseData:content.nodes}}" />
  </view>

在js里引入：

let wxparse = require("../../../../wxParse/wxParse.js");
Page({  /\*\*
   \* 页面的初始数据
   \*/
  data: {
      content: ''
  },
   onLoad: function(options) {     var that = this;
     .....     //在后台拿到content数据后, result.data.content就是拿到的数据
      wxparse.wxParse('content', 'html', result.data.content, that);
   }

在wxss引入：

@import "../../../../wxParse/wxParse.wxss";

相关推荐：

微信小程序中app.json配置的代码解析

小程序中页面布局和绝对定位以及按钮代码

以上就是小程序中页面兼容h5标签的解析的详细内容，更多请关注知企PROSAAS其它相关文章！

**Categories:** 后端开发

---