原使数据是这样的 

this.detailData.articleImg  这个是变量

<p>一二三四五六七八九十<span style=\"font-size:16px\"><span style=\"background-color:#ffffff\"><span style=\"color:#000000\">一二三四五六七八九十一二三四五六</span><span style=\"color:#db2727\">七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八</span><span style=\"color:#000000\">九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十一二三四五六七八九十</span></span></span></p><p class=\"media-wrap image-wrap\"></p><div class=\"media-wrap image-wrap\"><img id=\"hiforce-oss-sz-dev.oss-cn-shenzhen.aliyuncs.com/smart-city/cms/20210803/1627986029056.png\" title=\"media\" alt=\"media\" loop=\"\" autoplay=\"\" controls=\"\" src=\"//hiforce-oss-sz-dev.oss-cn-shenzhen.aliyuncs.com/smart-city/cms/20210803/1627986029056.png\"/></div><p></p><p>路附近 分开了</p><p>尽快v就v</p><div class=\"media-wrap image-wrap\"><img id=\"hiforce-oss-sz-dev.oss-cn-shenzhen.aliyuncs.com/smart-city/cms/20210803/1627986059625.jpg\" title=\"media\" alt=\"media\" loop=\"\" autoplay=\"\" controls=\"\" src=\"//hiforce-oss-sz-dev.oss-cn-shenzhen.aliyuncs.com/smart-city/cms/20210803/1627986059625.jpg\"/></div><p></p><p></p>"

我要获取标签里面的内容，我通过查资料，找了一个match方法

this.detailData.articleDetails.match(/(?<=>)(.|\s)*?(?=<\/?\w+[^<]*>)/g).join('').replace(/\s*/g, "").substr(0, 20) + '...'

这个方法在苹果手机访问报错，直接就是打不开页面，花了好长时间最后定位到这个正则的问题

找到问题出来哪里，又开始怎么解决这个问题，又长时间的找资料，最后找到用replace方法

his.detailData.articleDetails.replace(/<[^<>]+>/g, "").replace(/&nbsp;/gi, "").substr(0, 20) + '...'

完美的解决这个问题，花费二天时间，还和同事一起解决的，太难了！！！！！

记录一下，希望对别的朋友有帮助

最后，看了觉得有用，记得点个赞，谢谢！！！

文章参考

https://segmentfault.com/a/1190000022071681