在 html 转 wxml 的过程中,最大的问题就是 html 标签的转化,当前我的小程序用的是“wxParse”工具来实现 html to wxml,只不过有一个问题,当文章中含有“”符号时,虽然在获得的文章内容响应中这两个字符被编码为“<;”和“>;”,但是在 wxparse 解析 html 前会先进行 html 特殊字符的解码,就把“<;”和“>;”又解码为“”,然后才进行标签转化。这样就造成文章内容中的“”也会识别为 html 标签,造成解析出现问题,最终导致文章一直加载不出来。这里说一说我是怎么解决这个问题的。
先看看 wxparse 在解析 html 前是怎么解码 html 特殊字符的(解码代码在 wxDiscode.js 文件中)。
在 html2json.js 的 函数中,前几行是这样的:
可以看到在生成结点前先调用了 wxDiscode.js 中的 函数。我们再来看看这个函数是干啥的:
其实就是调用 wxDiscode.js 中的其他解码函数,这些解码函数中包含了很多 replace函数,对传送过来的字符串中的 html 特殊字符进行解码。其中我们可以看到有这样的两个替换(注意,为了显示正常,下面所有<;和>;的英文分号被中文分号替换):
这两个替换就是将字符串中的“<;”和“>;”替换为“”。 我的思路呢,很简单,就是在这里把这两个替换去掉,这样文章内容中的“”在解析时还是“<;”和“>;”的形式,就不怕被误解析了。然后在解析完生成的结点中再进行替换。 思路有了,怎么做呢?避免解析前替换很好弄,把那两行替换给注释掉就行了,解析后的替换呢?我们先看一下解析后的结点是怎么处理“text”结点的(在 html2json.js 文件中):
虽然不懂这段代码是啥意思,但我看到了:“ ”,于是我就找了找这个函数:“ ”,这个函数就在上面那段代码的下面:
嗯,我看到了 replace 函数,也看到了“emojiObj.text = str;”和最终返回的就是这个“emojiObj”,于是,我就在这个函数中使用了 replace 大法:
我在第3、4行添加了两个替换语句,将 str 中的“<;”和“>;”替换为“”。
保存,测试,之前加载不出来的文章顺利加载出来了
领取专属 10元无门槛券
私享最新 技术干货