jyf-parser改为mp-html

components/jyf-parser/jyf-parser.vue

@@ -1,645 +0,0 @@
-<template>
-	<view>
-		<slot v-if="!nodes.length" />
-		<!--#ifdef APP-PLUS-NVUE-->
-		<web-view id="_top" ref="web" :style="'margin-top:-2px;height:'+height+'px'" @onPostMessage="_message" />
-		<!--#endif-->
-		<!--#ifndef APP-PLUS-NVUE-->
-		<view id="_top" :style="showAm+(selectable?';user-select:text;-webkit-user-select:text':'')">
-			<!--#ifdef H5 || MP-360-->
-			<div :id="'rtf'+uid"></div>
-			<!--#endif-->
-			<!--#ifndef H5 || MP-360-->
-			<trees :nodes="nodes" :lazyLoad="lazyLoad" :loading="loadingImg" />
-			<!--#endif-->
-		</view>
-		<!--#endif-->
-	</view>
-</template>
-
-<script>
-	var search;
-	// #ifndef H5 || APP-PLUS-NVUE || MP-360
-	import trees from './libs/trees';
-	var cache = {},
-		// #ifdef MP-WEIXIN || MP-TOUTIAO
-		fs = uni.getFileSystemManager ? uni.getFileSystemManager() : null,
-		// #endif
-		Parser = require('./libs/MpHtmlParser.js');
-	var dom;
-	// 计算 cache 的 key
-	function hash(str) {
-		for (var i = str.length, val = 5381; i--;)
-			val += (val << 5) + str.charCodeAt(i);
-		return val;
-	}
-	// #endif
-	// #ifdef H5 || APP-PLUS-NVUE || MP-360
-	var {
-		windowWidth,
-		platform
-	} = uni.getSystemInfoSync(),
-		cfg = require('./libs/config.js');
-	// #endif
-	// #ifdef APP-PLUS-NVUE
-	var weexDom = weex.requireModule('dom');
-	// #endif
-	/**
-	 * Parser 富文本组件
-	 * @tutorial https://github.com/jin-yufeng/Parser
-	 * @property {String} html 富文本数据
-	 * @property {Boolean} autopause 是否在播放一个视频时自动暂停其他视频
-	 * @property {Boolean} autoscroll 是否自动给所有表格添加一个滚动层
-	 * @property {Boolean} autosetTitle 是否自动将 title 标签中的内容设置到页面标题
-	 * @property {Number} compress 压缩等级
-	 * @property {String} domain 图片、视频等链接的主域名
-	 * @property {Boolean} lazyLoad 是否开启图片懒加载
-	 * @property {String} loadingImg 图片加载完成前的占位图
-	 * @property {Boolean} selectable 是否开启长按复制
-	 * @property {Object} tagStyle 标签的默认样式
-	 * @property {Boolean} showWithAnimation 是否使用渐显动画
-	 * @property {Boolean} useAnchor 是否使用锚点
-	 * @property {Boolean} useCache 是否缓存解析结果
-	 * @event {Function} parse 解析完成事件
-	 * @event {Function} load dom 加载完成事件
-	 * @event {Function} ready 所有图片加载完毕事件
-	 * @event {Function} error 错误事件
-	 * @event {Function} imgtap 图片点击事件
-	 * @event {Function} linkpress 链接点击事件
-	 * @author JinYufeng
-	 * @version 20201029
-	 * @listens MIT
-	 */
-	export default {
-		name: 'parser',
-		data() {
-			return {
-				// #ifdef H5 || MP-360
-				uid: this._uid,
-				// #endif
-				// #ifdef APP-PLUS-NVUE
-				height: 1,
-				// #endif
-				// #ifndef APP-PLUS-NVUE
-				showAm: '',
-				// #endif
-				nodes: []
-			}
-		},
-		// #ifndef H5 || APP-PLUS-NVUE || MP-360
-		components: {
-			trees
-		},
-		// #endif
-		props: {
-			html: String,
-			autopause: {
-				type: Boolean,
-				default: true
-			},
-			autoscroll: Boolean,
-			autosetTitle: {
-				type: Boolean,
-				default: true
-			},
-			// #ifndef H5 || APP-PLUS-NVUE || MP-360
-			compress: Number,
-			loadingImg: String,
-			useCache: Boolean,
-			// #endif
-			domain: String,
-			lazyLoad: Boolean,
-			selectable: Boolean,
-			tagStyle: Object,
-			showWithAnimation: Boolean,
-			useAnchor: Boolean
-		},
-		watch: {
-			html(html) {
-				this.setContent(html);
-			}
-		},
-		created() {
-			// 图片数组
-			this.imgList = [];
-			this.imgList.each = function(f) {
-				for (var i = 0, len = this.length; i < len; i++)
-					this.setItem(i, f(this[i], i, this));
-			}
-			this.imgList.setItem = function(i, src) {
-				if (i == void 0 || !src) return;
-				// #ifndef MP-ALIPAY || APP-PLUS
-				// 去重
-				if (src.indexOf('http') == 0 && this.includes(src)) {
-					var newSrc = src.split('://')[0];
-					for (var j = newSrc.length, c; c = src[j]; j++) {
-						if (c == '/' && src[j - 1] != '/' && src[j + 1] != '/') break;
-						newSrc += Math.random() > 0.5 ? c.toUpperCase() : c;
-					}
-					newSrc += src.substr(j);
-					return this[i] = newSrc;
-				}
-				// #endif
-				this[i] = src;
-				// 暂存 data src
-				if (src.includes('data:image')) {
-					var filePath, info = src.match(/data:image\/(\S+?);(\S+?),(.+)/);
-					if (!info) return;
-					// #ifdef MP-WEIXIN || MP-TOUTIAO
-					filePath = `${wx.env.USER_DATA_PATH}/${Date.now()}.${info[1]}`;
-					fs && fs.writeFile({
-						filePath,
-						data: info[3],
-						encoding: info[2],
-						success: () => this[i] = filePath
-					})
-					// #endif
-					// #ifdef APP-PLUS
-					filePath = `_doc/parser_tmp/${Date.now()}.${info[1]}`;
-					var bitmap = new plus.nativeObj.Bitmap();
-					bitmap.loadBase64Data(src, () => {
-						bitmap.save(filePath, {}, () => {
-							bitmap.clear()
-							this[i] = filePath;
-						})
-					})
-					// #endif
-				}
-			}
-		},
-		mounted() {
-			// #ifdef H5 || MP-360
-			this.document = document.getElementById('rtf' + this._uid);
-			// #endif
-			// #ifndef H5 || APP-PLUS-NVUE || MP-360
-			if (dom) this.document = new dom(this);
-			// #endif
-			if (search) this.search = args => search(this, args);
-			// #ifdef APP-PLUS-NVUE
-			this.document = this.$refs.web;
-			setTimeout(() => {
-				// #endif
-				if (this.html) this.setContent(this.html);
-				// #ifdef APP-PLUS-NVUE
-			}, 30)
-			// #endif
-		},
-		beforeDestroy() {
-			// #ifdef H5 || MP-360
-			if (this._observer) this._observer.disconnect();
-			// #endif
-			this.imgList.each(src => {
-				// #ifdef APP-PLUS
-				if (src && src.includes('_doc')) {
-					plus.io.resolveLocalFileSystemURL(src, entry => {
-						entry.remove();
-					});
-				}
-				// #endif
-				// #ifdef MP-WEIXIN || MP-TOUTIAO
-				if (src && src.includes(uni.env.USER_DATA_PATH))
-					fs && fs.unlink({
-						filePath: src
-					})
-				// #endif
-			})
-			clearInterval(this._timer);
-		},
-		methods: {
-			// 设置富文本内容
-			setContent(html, append) {
-				// #ifdef APP-PLUS-NVUE
-				if (!html)
-					return this.height = 1;
-				if (append)
-					this.$refs.web.evalJs("var b=document.createElement('div');b.innerHTML='" + html.replace(/'/g, "\\'") +
-						"';document.getElementById('parser').appendChild(b)");
-				else {
-					html =
-						'<meta charset="utf-8" /><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"><style>html,body{width:100%;height:100%;overflow:hidden}body{margin:0}</style><base href="' +
-						this.domain + '"><div id="parser"' + (this.selectable ? '>' : ' style="user-select:none">') + this._handleHtml(html).replace(/\n/g, '\\n') +
-						'</div><script>"use strict";function e(e){if(window.__dcloud_weex_postMessage||window.__dcloud_weex_){var t={data:[e]};window.__dcloud_weex_postMessage?window.__dcloud_weex_postMessage(t):window.__dcloud_weex_.postMessage(JSON.stringify(t))}}document.body.onclick=function(){e({action:"click"})},' +
-						(this.showWithAnimation ? 'document.body.style.animation="_show .5s",' : '') +
-						'setTimeout(function(){e({action:"load",text:document.body.innerText,height:document.getElementById("parser").scrollHeight})},50);\x3c/script>';
-					if (platform == 'android') html = html.replace(/%/g, '%25');
-					this.$refs.web.evalJs("document.write('" + html.replace(/'/g, "\\'") + "');document.close()");
-				}
-				this.$refs.web.evalJs(
-					'var t=document.getElementsByTagName("title");t.length&&e({action:"getTitle",title:t[0].innerText});for(var o,n=document.getElementsByTagName("style"),r=1;o=n[r++];)o.innerHTML=o.innerHTML.replace(/body/g,"#parser");for(var a,c=document.getElementsByTagName("img"),s=[],i=0==c.length,d=0,l=0,g=0;a=c[l];l++)parseInt(a.style.width||a.getAttribute("width"))>' +
-					windowWidth + '&&(a.style.height="auto"),a.onload=function(){++d==c.length&&(i=!0)},a.onerror=function(){++d==c.length&&(i=!0),' + (cfg.errorImg ? 'this.src="' + cfg.errorImg + '",' : '') +
-					'e({action:"error",source:"img",target:this})},a.hasAttribute("ignore")||"A"==a.parentElement.nodeName||(a.i=g++,s.push(a.getAttribute("original-src")||a.src||a.getAttribute("data-src")),a.onclick=function(t){t.stopPropagation(),e({action:"preview",img:{i:this.i,src:this.src}})});e({action:"getImgList",imgList:s});for(var u,m=document.getElementsByTagName("a"),f=0;u=m[f];f++)u.onclick=function(m){m.stopPropagation();var t,o=this.getAttribute("href");if("#"==o[0]){var n=document.getElementById(o.substr(1));n&&(t=n.offsetTop)}return e({action:"linkpress",href:o,offset:t}),!1};for(var h,y=document.getElementsByTagName("video"),v=0;h=y[v];v++)h.style.maxWidth="100%",h.onerror=function(){e({action:"error",source:"video",target:this})}' +
-					(this.autopause ? ',h.onplay=function(){for(var e,t=0;e=y[t];t++)e!=this&&e.pause()}' : '') +
-					';for(var _,p=document.getElementsByTagName("audio"),w=0;_=p[w];w++)_.onerror=function(){e({action:"error",source:"audio",target:this})};' +
-					(this.autoscroll ? 'for(var T,E=document.getElementsByTagName("table"),B=0;T=E[B];B++){var N=document.createElement("div");N.style.overflow="scroll",T.parentNode.replaceChild(N,T),N.appendChild(T)}' : '') +
-					'var x=document.getElementById("parser");clearInterval(window.timer),window.timer=setInterval(function(){i&&clearInterval(window.timer),e({action:"ready",ready:i,height:x.scrollHeight})},350)'
-				)
-				this.nodes = [1];
-				// #endif
-				// #ifdef H5 || MP-360
-				if (!html) {
-					if (this.rtf && !append) this.rtf.parentNode.removeChild(this.rtf);
-					return;
-				}
-				var div = document.createElement('div');
-				if (!append) {
-					if (this.rtf) this.rtf.parentNode.removeChild(this.rtf);
-					this.rtf = div;
-				} else {
-					if (!this.rtf) this.rtf = div;
-					else this.rtf.appendChild(div);
-				}
-				div.innerHTML = this._handleHtml(html, append);
-				for (var styles = this.rtf.getElementsByTagName('style'), i = 0, style; style = styles[i++];) {
-					style.innerHTML = style.innerHTML.replace(/body/g, '#rtf' + this._uid);
-					style.setAttribute('scoped', 'true');
-				}
-				// 懒加载
-				if (!this._observer && this.lazyLoad && IntersectionObserver) {
-					this._observer = new IntersectionObserver(changes => {
-						for (let item, i = 0; item = changes[i++];) {
-							if (item.isIntersecting) {
-								item.target.src = item.target.getAttribute('data-src');
-								item.target.removeAttribute('data-src');
-								this._observer.unobserve(item.target);
-							}
-						}
-					}, {
-						rootMargin: '500px 0px 500px 0px'
-					})
-				}
-				var _ts = this;
-				// 获取标题
-				var title = this.rtf.getElementsByTagName('title');
-				if (title.length && this.autosetTitle)
-					uni.setNavigationBarTitle({
-						title: title[0].innerText
-					})
-				// 填充 domain
-				var fill = target => {
-					var src = target.getAttribute('src');
-					if (this.domain && src) {
-						if (src[0] == '/') {
-							if (src[1] == '/')
-								target.src = (this.domain.includes('://') ? this.domain.split('://')[0] : '') + ':' + src;
-							else target.src = this.domain + src;
-						} else if (!src.includes('://') && src.indexOf('data:') != 0) target.src = this.domain + '/' + src;
-					}
-				}
-				// 图片处理
-				this.imgList.length = 0;
-				var imgs = this.rtf.getElementsByTagName('img');
-				for (let i = 0, j = 0, img; img = imgs[i]; i++) {
-					if (parseInt(img.style.width || img.getAttribute('width')) > windowWidth)
-						img.style.height = 'auto';
-					fill(img);
-					if (!img.hasAttribute('ignore') && img.parentElement.nodeName != 'A') {
-						img.i = j++;
-						_ts.imgList.push(img.getAttribute('original-src') || img.src || img.getAttribute('data-src'));
-						img.onclick = function(e) {
-							e.stopPropagation();
-							var preview = true;
-							this.ignore = () => preview = false;
-							_ts.$emit('imgtap', this);
-							if (preview) {
-								// uni.previewImage({
-								// 	current: this.i,
-								// 	urls: _ts.imgList
-								// });
-							}
-						}
-					}
-					img.onerror = function() {
-						if (cfg.errorImg)
-							_ts.imgList[this.i] = this.src = cfg.errorImg;
-						_ts.$emit('error', {
-							source: 'img',
-							target: this
-						});
-					}
-					if (_ts.lazyLoad && this._observer && img.src && img.i != 0) {
-						img.setAttribute('data-src', img.src);
-						img.removeAttribute('src');
-						this._observer.observe(img);
-					}
-				}
-				// 链接处理
-				var links = this.rtf.getElementsByTagName('a');
-				for (var link of links) {
-					link.onclick = function(e) {
-						e.stopPropagation();
-						var jump = true,
-							href = this.getAttribute('href');
-						_ts.$emit('linkpress', {
-							href,
-							ignore: () => jump = false
-						});
-						if (jump && href) {
-							if (href[0] == '#') {
-								if (_ts.useAnchor) {
-									_ts.navigateTo({
-										id: href.substr(1)
-									})
-								}
-							} else if (href.indexOf('http') == 0 || href.indexOf('//') == 0)
-								return true;
-							else
-								uni.navigateTo({
-									url: href
-								})
-						}
-						return false;
-					}
-				}
-				// 视频处理
-				var videos = this.rtf.getElementsByTagName('video');
-				_ts.videoContexts = videos;
-				for (let video, i = 0; video = videos[i++];) {
-					fill(video);
-					video.style.maxWidth = '100%';
-					video.onerror = function() {
-						_ts.$emit('error', {
-							source: 'video',
-							target: this
-						});
-					}
-					video.onplay = function() {
-						if (_ts.autopause)
-							for (let item, i = 0; item = _ts.videoContexts[i++];)
-								if (item != this) item.pause();
-					}
-				}
-				// 音频处理
-				var audios = this.rtf.getElementsByTagName('audio');
-				for (var audio of audios) {
-					fill(audio);
-					audio.onerror = function() {
-						_ts.$emit('error', {
-							source: 'audio',
-							target: this
-						});
-					}
-				}
-				// 表格处理
-				if (this.autoscroll) {
-					var tables = this.rtf.getElementsByTagName('table');
-					for (var table of tables) {
-						let div = document.createElement('div');
-						div.style.overflow = 'scroll';
-						table.parentNode.replaceChild(div, table);
-						div.appendChild(table);
-					}
-				}
-				if (!append) this.document.appendChild(this.rtf);
-				this.$nextTick(() => {
-					this.nodes = [1];
-					this.$emit('load');
-				});
-				setTimeout(() => this.showAm = '', 500);
-				// #endif
-				// #ifndef APP-PLUS-NVUE
-				// #ifndef H5 || MP-360
-				var nodes;
-				if (!html) return this.nodes = [];
-				var parser = new Parser(html, this);
-				// 缓存读取
-				if (this.useCache) {
-					var hashVal = hash(html);
-					if (cache[hashVal])
-						nodes = cache[hashVal];
-					else {
-						nodes = parser.parse();
-						cache[hashVal] = nodes;
-					}
-				} else nodes = parser.parse();
-				this.$emit('parse', nodes);
-				if (append) this.nodes = this.nodes.concat(nodes);
-				else this.nodes = nodes;
-				if (nodes.length && nodes.title && this.autosetTitle)
-					uni.setNavigationBarTitle({
-						title: nodes.title
-					})
-				if (this.imgList) this.imgList.length = 0;
-				this.videoContexts = [];
-				this.$nextTick(() => {
-					(function f(cs) {
-						for (var i = cs.length; i--;) {
-							if (cs[i].top) {
-								cs[i].controls = [];
-								cs[i].init();
-								f(cs[i].$children);
-							}
-						}
-					})(this.$children)
-					this.$emit('load');
-				})
-				// #endif
-				var height;
-				clearInterval(this._timer);
-				this._timer = setInterval(() => {
-					// #ifdef H5 || MP-360
-					this.rect = this.rtf.getBoundingClientRect();
-					// #endif
-					// #ifndef H5 || MP-360
-					uni.createSelectorQuery().in(this)
-						.select('#_top').boundingClientRect().exec(res => {
-							if (!res) return;
-							this.rect = res[0];
-							// #endif
-							if (this.rect.height == height) {
-								this.$emit('ready', this.rect)
-								clearInterval(this._timer);
-							}
-							height = this.rect.height;
-							// #ifndef H5 || MP-360
-						});
-					// #endif
-				}, 350);
-				if (this.showWithAnimation && !append) this.showAm = 'animation:_show .5s';
-				// #endif
-			},
-			// 获取文本内容
-			getText(ns = this.nodes) {
-				var txt = '';
-				// #ifdef APP-PLUS-NVUE
-				txt = this._text;
-				// #endif
-				// #ifdef H5 || MP-360
-				txt = this.rtf.innerText;
-				// #endif
-				// #ifndef H5 || APP-PLUS-NVUE || MP-360
-				for (var i = 0, n; n = ns[i++];) {
-					if (n.type == 'text') txt += n.text.replace(/&nbsp;/g, '\u00A0').replace(/&lt;/g, '<').replace(/&gt;/g, '>')
-						.replace(/&amp;/g, '&');
-					else if (n.type == 'br') txt += '\n';
-					else {
-						// 块级标签前后加换行
-						var block = n.name == 'p' || n.name == 'div' || n.name == 'tr' || n.name == 'li' || (n.name[0] == 'h' && n.name[1] >
-							'0' && n.name[1] < '7');
-						if (block && txt && txt[txt.length - 1] != '\n') txt += '\n';
-						if (n.children) txt += this.getText(n.children);
-						if (block && txt[txt.length - 1] != '\n') txt += '\n';
-						else if (n.name == 'td' || n.name == 'th') txt += '\t';
-					}
-				}
-				// #endif
-				return txt;
-			},
-			// 锚点跳转
-			in (obj) {
-				if (obj.page && obj.selector && obj.scrollTop) this._in = obj;
-			},
-			navigateTo(obj) {
-				if (!this.useAnchor) return obj.fail && obj.fail('Anchor is disabled');
-				// #ifdef APP-PLUS-NVUE
-				if (!obj.id)
-					weexDom.scrollToElement(this.$refs.web);
-				else
-					this.$refs.web.evalJs('var pos=document.getElementById("' + obj.id +
-						'");if(pos)post({action:"linkpress",href:"#",offset:pos.offsetTop+' + (obj.offset || 0) + '})');
-				obj.success && obj.success();
-				// #endif
-				// #ifndef APP-PLUS-NVUE
-				var d = ' ';
-				// #ifdef MP-WEIXIN || MP-QQ || MP-TOUTIAO
-				d = '>>>';
-				// #endif
-				var selector = uni.createSelectorQuery().in(this._in ? this._in.page : this).select((this._in ? this._in.selector :
-					'#_top') + (obj.id ? `${d}#${obj.id},${this._in?this._in.selector:'#_top'}${d}.${obj.id}` : '')).boundingClientRect();
-				if (this._in) selector.select(this._in.selector).scrollOffset().select(this._in.selector).boundingClientRect();
-				else selector.selectViewport().scrollOffset();
-				selector.exec(res => {
-					if (!res[0]) return obj.fail && obj.fail('Label not found')
-					var scrollTop = res[1].scrollTop + res[0].top - (res[2] ? res[2].top : 0) + (obj.offset || 0);
-					if (this._in) this._in.page[this._in.scrollTop] = scrollTop;
-					else uni.pageScrollTo({
-						scrollTop,
-						duration: 300
-					})
-					obj.success && obj.success();
-				})
-				// #endif
-			},
-			// 获取视频对象
-			getVideoContext(id) {
-				// #ifndef APP-PLUS-NVUE
-				if (!id) return this.videoContexts;
-				else
-					for (var i = this.videoContexts.length; i--;)
-						if (this.videoContexts[i].id == id) return this.videoContexts[i];
-				// #endif
-			},
-			// #ifdef H5 || APP-PLUS-NVUE || MP-360
-			_handleHtml(html, append) {
-				if (!append) {
-					// 处理 tag-style 和 userAgentStyles
-					var style = '<style>@keyframes _show{0%{opacity:0}100%{opacity:1}}img{max-width:100%;display:block}';
-					for (var item in cfg.userAgentStyles)
-						style += `${item}{${cfg.userAgentStyles[item]}}`;
-					for (item in this.tagStyle)
-						style += `${item}{${this.tagStyle[item]}}`;
-					style += '</style>';
-					html = style + html;
-				}
-				// 处理 rpx
-				if (html.includes('rpx'))
-					html = html.replace(/[0-9.]+\s*rpx/g, $ => (parseFloat($) * windowWidth / 750) + 'px');
-				return html;
-			},
-			// #endif
-			// #ifdef APP-PLUS-NVUE
-			_message(e) {
-				// 接收 web-view 消息
-				var d = e.detail.data[0];
-				switch (d.action) {
-					case 'load':
-						this.$emit('load');
-						this.height = d.height;
-						this._text = d.text;
-						break;
-					case 'getTitle':
-						if (this.autosetTitle)
-							uni.setNavigationBarTitle({
-								title: d.title
-							})
-						break;
-					case 'getImgList':
-						this.imgList.length = 0;
-						for (var i = d.imgList.length; i--;)
-							this.imgList.setItem(i, d.imgList[i]);
-						break;
-					case 'preview':
-						var preview = true;
-						d.img.ignore = () => preview = false;
-						this.$emit('imgtap', d.img);
-						if (preview)
-							// uni.previewImage({
-							// 	current: d.img.i,
-							// 	urls: this.imgList
-							// })
-						break;
-					case 'linkpress':
-						var jump = true,
-							href = d.href;
-						this.$emit('linkpress', {
-							href,
-							ignore: () => jump = false
-						})
-						if (jump && href) {
-							if (href[0] == '#') {
-								if (this.useAnchor)
-									weexDom.scrollToElement(this.$refs.web, {
-										offset: d.offset
-									})
-							} else if (href.includes('://'))
-								plus.runtime.openWeb(href);
-							else
-								uni.navigateTo({
-									url: href
-								})
-						}
-						break;
-					case 'error':
-						if (d.source == 'img' && cfg.errorImg)
-							this.imgList.setItem(d.target.i, cfg.errorImg);
-						this.$emit('error', {
-							source: d.source,
-							target: d.target
-						})
-						break;
-					case 'ready':
-						this.height = d.height;
-						if (d.ready) uni.createSelectorQuery().in(this).select('#_top').boundingClientRect().exec(res => {
-							this.rect = res[0];
-							this.$emit('ready', res[0]);
-						})
-						break;
-					case 'click':
-						this.$emit('click');
-						this.$emit('tap');
-				}
-			},
-			// #endif
-		}
-	}
-</script>
-
-<style>
-	@keyframes _show {
-		0% {
-			opacity: 0;
-		}
-
-		100% {
-			opacity: 1;
-		}
-	}
-
-	/* #ifdef MP-WEIXIN */
-	:host {
-		display: block;
-		overflow: auto;
-		-webkit-overflow-scrolling: touch;
-	}
-
-	/* #endif */
-</style>

components/jyf-parser/libs/CssHandler.js

@@ -1,100 +0,0 @@
-const cfg = require('./config.js'),
-	isLetter = c => (c >= 'a' && c <= 'z') || (c >= 'A' && c <= 'Z');
-
-function CssHandler(tagStyle) {
-	var styles = Object.assign(Object.create(null), cfg.userAgentStyles);
-	for (var item in tagStyle)
-		styles[item] = (styles[item] ? styles[item] + ';' : '') + tagStyle[item];
-	this.styles = styles;
-}
-CssHandler.prototype.getStyle = function(data) {
-	this.styles = new parser(data, this.styles).parse();
-}
-CssHandler.prototype.match = function(name, attrs) {
-	var tmp, matched = (tmp = this.styles[name]) ? tmp + ';' : '';
-	if (attrs.class) {
-		var items = attrs.class.split(' ');
-		for (var i = 0, item; item = items[i]; i++)
-			if (tmp = this.styles['.' + item])
-				matched += tmp + ';';
-	}
-	if (tmp = this.styles['#' + attrs.id])
-		matched += tmp + ';';
-	return matched;
-}
-module.exports = CssHandler;
-
-function parser(data, init) {
-	this.data = data;
-	this.floor = 0;
-	this.i = 0;
-	this.list = [];
-	this.res = init;
-	this.state = this.Space;
-}
-parser.prototype.parse = function() {
-	for (var c; c = this.data[this.i]; this.i++)
-		this.state(c);
-	return this.res;
-}
-parser.prototype.section = function() {
-	return this.data.substring(this.start, this.i);
-}
-// 状态机
-parser.prototype.Space = function(c) {
-	if (c == '.' || c == '#' || isLetter(c)) {
-		this.start = this.i;
-		this.state = this.Name;
-	} else if (c == '/' && this.data[this.i + 1] == '*')
-		this.Comment();
-	else if (!cfg.blankChar[c] && c != ';')
-		this.state = this.Ignore;
-}
-parser.prototype.Comment = function() {
-	this.i = this.data.indexOf('*/', this.i) + 1;
-	if (!this.i) this.i = this.data.length;
-	this.state = this.Space;
-}
-parser.prototype.Ignore = function(c) {
-	if (c == '{') this.floor++;
-	else if (c == '}' && !--this.floor) {
-		this.list = [];
-		this.state = this.Space;
-	}
-}
-parser.prototype.Name = function(c) {
-	if (cfg.blankChar[c]) {
-		this.list.push(this.section());
-		this.state = this.NameSpace;
-	} else if (c == '{') {
-		this.list.push(this.section());
-		this.Content();
-	} else if (c == ',') {
-		this.list.push(this.section());
-		this.Comma();
-	} else if (!isLetter(c) && (c < '0' || c > '9') && c != '-' && c != '_')
-		this.state = this.Ignore;
-}
-parser.prototype.NameSpace = function(c) {
-	if (c == '{') this.Content();
-	else if (c == ',') this.Comma();
-	else if (!cfg.blankChar[c]) this.state = this.Ignore;
-}
-parser.prototype.Comma = function() {
-	while (cfg.blankChar[this.data[++this.i]]);
-	if (this.data[this.i] == '{') this.Content();
-	else {
-		this.start = this.i--;
-		this.state = this.Name;
-	}
-}
-parser.prototype.Content = function() {
-	this.start = ++this.i;
-	if ((this.i = this.data.indexOf('}', this.i)) == -1) this.i = this.data.length;
-	var content = this.section();
-	for (var i = 0, item; item = this.list[i++];)
-		if (this.res[item]) this.res[item] += ';' + content;
-		else this.res[item] = content;
-	this.list = [];
-	this.state = this.Space;
-}

components/jyf-parser/libs/MpHtmlParser.js

@@ -1,580 +0,0 @@
-/**
- * html 解析器
- * @tutorial https://github.com/jin-yufeng/Parser
- * @version 20201029
- * @author JinYufeng
- * @listens MIT
- */
-const cfg = require('./config.js'),
-	blankChar = cfg.blankChar,
-	CssHandler = require('./CssHandler.js'),
-	windowWidth = uni.getSystemInfoSync().windowWidth;
-var emoji;
-
-function MpHtmlParser(data, options = {}) {
-	this.attrs = {};
-	this.CssHandler = new CssHandler(options.tagStyle, windowWidth);
-	this.data = data;
-	this.domain = options.domain;
-	this.DOM = [];
-	this.i = this.start = this.audioNum = this.imgNum = this.videoNum = 0;
-	options.prot = (this.domain || '').includes('://') ? this.domain.split('://')[0] : 'http';
-	this.options = options;
-	this.state = this.Text;
-	this.STACK = [];
-	// 工具函数
-	this.bubble = () => {
-		for (var i = this.STACK.length, item; item = this.STACK[--i];) {
-			if (cfg.richOnlyTags[item.name]) return false;
-			item.c = 1;
-		}
-		return true;
-	}
-	this.decode = (val, amp) => {
-		var i = -1,
-			j, en;
-		while (1) {
-			if ((i = val.indexOf('&', i + 1)) == -1) break;
-			if ((j = val.indexOf(';', i + 2)) == -1) break;
-			if (val[i + 1] == '#') {
-				en = parseInt((val[i + 2] == 'x' ? '0' : '') + val.substring(i + 2, j));
-				if (!isNaN(en)) val = val.substr(0, i) + String.fromCharCode(en) + val.substr(j + 1);
-			} else {
-				en = val.substring(i + 1, j);
-				if (cfg.entities[en] || en == amp)
-					val = val.substr(0, i) + (cfg.entities[en] || '&') + val.substr(j + 1);
-			}
-		}
-		return val;
-	}
-	this.getUrl = url => {
-		if (url[0] == '/') {
-			if (url[1] == '/') url = this.options.prot + ':' + url;
-			else if (this.domain) url = this.domain + url;
-		} else if (this.domain && url.indexOf('data:') != 0 && !url.includes('://'))
-			url = this.domain + '/' + url;
-		return url;
-	}
-	this.isClose = () => this.data[this.i] == '>' || (this.data[this.i] == '/' && this.data[this.i + 1] == '>');
-	this.section = () => this.data.substring(this.start, this.i);
-	this.parent = () => this.STACK[this.STACK.length - 1];
-	this.siblings = () => this.STACK.length ? this.parent().children : this.DOM;
-}
-MpHtmlParser.prototype.parse = function() {
-	if (emoji) this.data = emoji.parseEmoji(this.data);
-	for (var c; c = this.data[this.i]; this.i++)
-		this.state(c);
-	if (this.state == this.Text) this.setText();
-	while (this.STACK.length) this.popNode(this.STACK.pop());
-	return this.DOM;
-}
-// 设置属性
-MpHtmlParser.prototype.setAttr = function() {
-	var name = this.attrName.toLowerCase(),
-		val = this.attrVal;
-	if (cfg.boolAttrs[name]) this.attrs[name] = 'T';
-	else if (val) {
-		if (name == 'src' || (name == 'data-src' && !this.attrs.src)) this.attrs.src = this.getUrl(this.decode(val, 'amp'));
-		else if (name == 'href' || name == 'style') this.attrs[name] = this.decode(val, 'amp');
-		else if (name.substr(0, 5) != 'data-') this.attrs[name] = val;
-	}
-	this.attrVal = '';
-	while (blankChar[this.data[this.i]]) this.i++;
-	if (this.isClose()) this.setNode();
-	else {
-		this.start = this.i;
-		this.state = this.AttrName;
-	}
-}
-// 设置文本节点
-MpHtmlParser.prototype.setText = function() {
-	var back, text = this.section();
-	if (!text) return;
-	text = (cfg.onText && cfg.onText(text, () => back = true)) || text;
-	if (back) {
-		this.data = this.data.substr(0, this.start) + text + this.data.substr(this.i);
-		let j = this.start + text.length;
-		for (this.i = this.start; this.i < j; this.i++) this.state(this.data[this.i]);
-		return;
-	}
-	if (!this.pre) {
-		// 合并空白符
-		var flag, tmp = [];
-		for (let i = text.length, c; c = text[--i];)
-			if (!blankChar[c]) {
-				tmp.unshift(c);
-				if (!flag) flag = 1;
-			} else {
-				if (tmp[0] != ' ') tmp.unshift(' ');
-				if (c == '\n' && flag == void 0) flag = 0;
-			}
-		if (flag == 0) return;
-		text = tmp.join('');
-	}
-	this.siblings().push({
-		type: 'text',
-		text: this.decode(text)
-	});
-}
-// 设置元素节点
-MpHtmlParser.prototype.setNode = function() {
-	var node = {
-			name: this.tagName.toLowerCase(),
-			attrs: this.attrs
-		},
-		close = cfg.selfClosingTags[node.name];
-	if (this.options.nodes.length) node.type = 'node';
-	this.attrs = {};
-	if (!cfg.ignoreTags[node.name]) {
-		// 处理属性
-		var attrs = node.attrs,
-			style = this.CssHandler.match(node.name, attrs, node) + (attrs.style || ''),
-			styleObj = {};
-		if (attrs.id) {
-			if (this.options.compress & 1) attrs.id = void 0;
-			else if (this.options.useAnchor) this.bubble();
-		}
-		if ((this.options.compress & 2) && attrs.class) attrs.class = void 0;
-		switch (node.name) {
-			case 'a':
-			case 'ad': // #ifdef APP-PLUS
-			case 'iframe':
-				// #endif
-				this.bubble();
-				break;
-			case 'font':
-				if (attrs.color) {
-					styleObj['color'] = attrs.color;
-					attrs.color = void 0;
-				}
-				if (attrs.face) {
-					styleObj['font-family'] = attrs.face;
-					attrs.face = void 0;
-				}
-				if (attrs.size) {
-					var size = parseInt(attrs.size);
-					if (size < 1) size = 1;
-					else if (size > 7) size = 7;
-					var map = ['xx-small', 'x-small', 'small', 'medium', 'large', 'x-large', 'xx-large'];
-					styleObj['font-size'] = map[size - 1];
-					attrs.size = void 0;
-				}
-				break;
-			case 'embed':
-				// #ifndef APP-PLUS
-				var src = node.attrs.src || '',
-					type = node.attrs.type || '';
-				if (type.includes('video') || src.includes('.mp4') || src.includes('.3gp') || src.includes('.m3u8'))
-					node.name = 'video';
-				else if (type.includes('audio') || src.includes('.m4a') || src.includes('.wav') || src.includes('.mp3') || src.includes(
-						'.aac'))
-					node.name = 'audio';
-				else break;
-				if (node.attrs.autostart)
-					node.attrs.autoplay = 'T';
-				node.attrs.controls = 'T';
-				// #endif
-				// #ifdef APP-PLUS
-				this.bubble();
-				break;
-				// #endif
-			case 'video':
-			case 'audio':
-				if (!attrs.id) attrs.id = node.name + (++this[`${node.name}Num`]);
-				else this[`${node.name}Num`]++;
-				if (node.name == 'video') {
-					if (this.videoNum > 3)
-						node.lazyLoad = 1;
-					if (attrs.width) {
-						styleObj.width = parseFloat(attrs.width) + (attrs.width.includes('%') ? '%' : 'px');
-						attrs.width = void 0;
-					}
-					if (attrs.height) {
-						styleObj.height = parseFloat(attrs.height) + (attrs.height.includes('%') ? '%' : 'px');
-						attrs.height = void 0;
-					}
-				}
-				if (!attrs.controls && !attrs.autoplay) attrs.controls = 'T';
-				attrs.source = [];
-				if (attrs.src) {
-					attrs.source.push(attrs.src);
-					attrs.src = void 0;
-				}
-				this.bubble();
-				break;
-			case 'td':
-			case 'th':
-				if (attrs.colspan || attrs.rowspan)
-					for (var k = this.STACK.length, item; item = this.STACK[--k];)
-						if (item.name == 'table') {
-							item.flag = 1;
-							break;
-						}
-		}
-		if (attrs.align) {
-			if (node.name == 'table') {
-				if (attrs.align == 'center') styleObj['margin-inline-start'] = styleObj['margin-inline-end'] = 'auto';
-				else styleObj['float'] = attrs.align;
-			} else styleObj['text-align'] = attrs.align;
-			attrs.align = void 0;
-		}
-		// 压缩 style
-		var styles = style.split(';');
-		style = '';
-		for (var i = 0, len = styles.length; i < len; i++) {
-			var info = styles[i].split(':');
-			if (info.length < 2) continue;
-			let key = info[0].trim().toLowerCase(),
-				value = info.slice(1).join(':').trim();
-			if (value[0] == '-' || value.includes('safe'))
-				style += `;${key}:${value}`;
-			else if (!styleObj[key] || value.includes('import') || !styleObj[key].includes('import'))
-				styleObj[key] = value;
-		}
-		if (node.name == 'img') {
-			if (attrs.src && !attrs.ignore) {
-				if (this.bubble())
-					attrs.i = (this.imgNum++).toString();
-				else attrs.ignore = 'T';
-			}
-			if (attrs.ignore) {
-				style += ';-webkit-touch-callout:none';
-				styleObj['max-width'] = '100%';
-			}
-			var width;
-			if (styleObj.width) width = styleObj.width;
-			else if (attrs.width) width = attrs.width.includes('%') ? attrs.width : parseFloat(attrs.width) + 'px';
-			if (width) {
-				styleObj.width = width;
-				attrs.width = '100%';
-				if (parseInt(width) > windowWidth) {
-					styleObj.height = '';
-					if (attrs.height) attrs.height = void 0;
-				}
-			}
-			if (styleObj.height) {
-				attrs.height = styleObj.height;
-				styleObj.height = '';
-			} else if (attrs.height && !attrs.height.includes('%'))
-				attrs.height = parseFloat(attrs.height) + 'px';
-		}
-		for (var key in styleObj) {
-			var value = styleObj[key];
-			if (!value) continue;
-			if (key.includes('flex') || key == 'order' || key == 'self-align') node.c = 1;
-			// 填充链接
-			if (value.includes('url')) {
-				var j = value.indexOf('(');
-				if (j++ != -1) {
-					while (value[j] == '"' || value[j] == "'" || blankChar[value[j]]) j++;
-					value = value.substr(0, j) + this.getUrl(value.substr(j));
-				}
-			}
-			// 转换 rpx
-			else if (value.includes('rpx'))
-				value = value.replace(/[0-9.]+\s*rpx/g, $ => parseFloat($) * windowWidth / 750 + 'px');
-			else if (key == 'white-space' && value.includes('pre') && !close)
-				this.pre = node.pre = true;
-			style += `;${key}:${value}`;
-		}
-		style = style.substr(1);
-		if (style) attrs.style = style;
-		if (!close) {
-			node.children = [];
-			if (node.name == 'pre' && cfg.highlight) {
-				this.remove(node);
-				this.pre = node.pre = true;
-			}
-			this.siblings().push(node);
-			this.STACK.push(node);
-		} else if (!cfg.filter || cfg.filter(node, this) != false)
-			this.siblings().push(node);
-	} else {
-		if (!close) this.remove(node);
-		else if (node.name == 'source') {
-			var parent = this.parent();
-			if (parent && (parent.name == 'video' || parent.name == 'audio') && node.attrs.src)
-				parent.attrs.source.push(node.attrs.src);
-		} else if (node.name == 'base' && !this.domain) this.domain = node.attrs.href;
-	}
-	if (this.data[this.i] == '/') this.i++;
-	this.start = this.i + 1;
-	this.state = this.Text;
-}
-// 移除标签
-MpHtmlParser.prototype.remove = function(node) {
-	var name = node.name,
-		j = this.i;
-	// 处理 svg
-	var handleSvg = () => {
-		var src = this.data.substring(j, this.i + 1);
-		node.attrs.xmlns = 'http://www.w3.org/2000/svg';
-		for (var key in node.attrs) {
-			if (key == 'viewbox') src = ` viewBox="${node.attrs.viewbox}"` + src;
-			else if (key != 'style') src = ` ${key}="${node.attrs[key]}"` + src;
-		}
-		src = '<svg' + src;
-		var parent = this.parent();
-		if (node.attrs.width == '100%' && parent && (parent.attrs.style || '').includes('inline'))
-			parent.attrs.style = 'width:300px;max-width:100%;' + parent.attrs.style;
-		this.siblings().push({
-			name: 'img',
-			attrs: {
-				src: 'data:image/svg+xml;utf8,' + src.replace(/#/g, '%23'),
-				style: node.attrs.style,
-				ignore: 'T'
-			}
-		})
-	}
-	if (node.name == 'svg' && this.data[j] == '/') return handleSvg(this.i++);
-	while (1) {
-		if ((this.i = this.data.indexOf('</', this.i + 1)) == -1) {
-			if (name == 'pre' || name == 'svg') this.i = j;
-			else this.i = this.data.length;
-			return;
-		}
-		this.start = (this.i += 2);
-		while (!blankChar[this.data[this.i]] && !this.isClose()) this.i++;
-		if (this.section().toLowerCase() == name) {
-			// 代码块高亮
-			if (name == 'pre') {
-				this.data = this.data.substr(0, j + 1) + cfg.highlight(this.data.substring(j + 1, this.i - 5), node.attrs) + this.data
-					.substr(this.i - 5);
-				return this.i = j;
-			} else if (name == 'style')
-				this.CssHandler.getStyle(this.data.substring(j + 1, this.i - 7));
-			else if (name == 'title')
-				this.DOM.title = this.data.substring(j + 1, this.i - 7);
-			if ((this.i = this.data.indexOf('>', this.i)) == -1) this.i = this.data.length;
-			if (name == 'svg') handleSvg();
-			return;
-		}
-	}
-}
-// 节点出栈处理
-MpHtmlParser.prototype.popNode = function(node) {
-	// 空白符处理
-	if (node.pre) {
-		node.pre = this.pre = void 0;
-		for (let i = this.STACK.length; i--;)
-			if (this.STACK[i].pre)
-				this.pre = true;
-	}
-	var siblings = this.siblings(),
-		len = siblings.length,
-		childs = node.children;
-	if (node.name == 'head' || (cfg.filter && cfg.filter(node, this) == false))
-		return siblings.pop();
-	var attrs = node.attrs;
-	// 替换一些标签名
-	if (cfg.blockTags[node.name]) node.name = 'div';
-	else if (!cfg.trustTags[node.name]) node.name = 'span';
-	// 处理列表
-	if (node.c && (node.name == 'ul' || node.name == 'ol')) {
-		if ((node.attrs.style || '').includes('list-style:none')) {
-			for (let i = 0, child; child = childs[i++];)
-				if (child.name == 'li')
-					child.name = 'div';
-		} else if (node.name == 'ul') {
-			var floor = 1;
-			for (let i = this.STACK.length; i--;)
-				if (this.STACK[i].name == 'ul') floor++;
-			if (floor != 1)
-				for (let i = childs.length; i--;)
-					childs[i].floor = floor;
-		} else {
-			for (let i = 0, num = 1, child; child = childs[i++];)
-				if (child.name == 'li') {
-					child.type = 'ol';
-					child.num = ((num, type) => {
-						if (type == 'a') return String.fromCharCode(97 + (num - 1) % 26);
-						if (type == 'A') return String.fromCharCode(65 + (num - 1) % 26);
-						if (type == 'i' || type == 'I') {
-							num = (num - 1) % 99 + 1;
-							var one = ['I', 'II', 'III', 'IV', 'V', 'VI', 'VII', 'VIII', 'IX'],
-								ten = ['X', 'XX', 'XXX', 'XL', 'L', 'LX', 'LXX', 'LXXX', 'XC'],
-								res = (ten[Math.floor(num / 10) - 1] || '') + (one[num % 10 - 1] || '');
-							if (type == 'i') return res.toLowerCase();
-							return res;
-						}
-						return num;
-					})(num++, attrs.type) + '.';
-				}
-		}
-	}
-	// 处理表格
-	if (node.name == 'table') {
-		var padding = parseFloat(attrs.cellpadding),
-			spacing = parseFloat(attrs.cellspacing),
-			border = parseFloat(attrs.border);
-		if (node.c) {
-			if (isNaN(padding)) padding = 2;
-			if (isNaN(spacing)) spacing = 2;
-		}
-		if (border) attrs.style = `border:${border}px solid gray;${attrs.style || ''}`;
-		if (node.flag && node.c) {
-			// 有 colspan 或 rowspan 且含有链接的表格转为 grid 布局实现
-			attrs.style = `${attrs.style || ''};${spacing ? `;grid-gap:${spacing}px` : ';border-left:0;border-top:0'}`;
-			var row = 1,
-				col = 1,
-				colNum,
-				trs = [],
-				children = [],
-				map = {};
-			(function f(ns) {
-				for (var i = 0; i < ns.length; i++) {
-					if (ns[i].name == 'tr') trs.push(ns[i]);
-					else f(ns[i].children || []);
-				}
-			})(node.children)
-			for (let i = 0; i < trs.length; i++) {
-				for (let j = 0, td; td = trs[i].children[j]; j++) {
-					if (td.name == 'td' || td.name == 'th') {
-						while (map[row + '.' + col]) col++;
-						var cell = {
-							name: 'div',
-							c: 1,
-							attrs: {
-								style: (td.attrs.style || '') + (border ? `;border:${border}px solid gray` + (spacing ? '' :
-									';border-right:0;border-bottom:0') : '') + (padding ? `;padding:${padding}px` : '')
-							},
-							children: td.children
-						}
-						if (td.attrs.colspan) {
-							cell.attrs.style += ';grid-column-start:' + col + ';grid-column-end:' + (col + parseInt(td.attrs.colspan));
-							if (!td.attrs.rowspan) cell.attrs.style += ';grid-row-start:' + row + ';grid-row-end:' + (row + 1);
-							col += parseInt(td.attrs.colspan) - 1;
-						}
-						if (td.attrs.rowspan) {
-							cell.attrs.style += ';grid-row-start:' + row + ';grid-row-end:' + (row + parseInt(td.attrs.rowspan));
-							if (!td.attrs.colspan) cell.attrs.style += ';grid-column-start:' + col + ';grid-column-end:' + (col + 1);
-							for (var k = 1; k < td.attrs.rowspan; k++) map[(row + k) + '.' + col] = 1;
-						}
-						children.push(cell);
-						col++;
-					}
-				}
-				if (!colNum) {
-					colNum = col - 1;
-					attrs.style += `;grid-template-columns:repeat(${colNum},auto)`
-				}
-				col = 1;
-				row++;
-			}
-			node.children = children;
-		} else {
-			attrs.style = `border-spacing:${spacing}px;${attrs.style || ''}`;
-			if (border || padding)
-				(function f(ns) {
-					for (var i = 0, n; n = ns[i]; i++) {
-						if (n.name == 'th' || n.name == 'td') {
-							if (border) n.attrs.style = `border:${border}px solid gray;${n.attrs.style || ''}`;
-							if (padding) n.attrs.style = `padding:${padding}px;${n.attrs.style || ''}`;
-						} else f(n.children || []);
-					}
-				})(childs)
-		}
-		if (this.options.autoscroll) {
-			var table = Object.assign({}, node);
-			node.name = 'div';
-			node.attrs = {
-				style: 'overflow:scroll'
-			}
-			node.children = [table];
-		}
-	}
-	this.CssHandler.pop && this.CssHandler.pop(node);
-	// 自动压缩
-	if (node.name == 'div' && !Object.keys(attrs).length && childs.length == 1 && childs[0].name == 'div')
-		siblings[len - 1] = childs[0];
-}
-// 状态机
-MpHtmlParser.prototype.Text = function(c) {
-	if (c == '<') {
-		var next = this.data[this.i + 1],
-			isLetter = c => (c >= 'a' && c <= 'z') || (c >= 'A' && c <= 'Z');
-		if (isLetter(next)) {
-			this.setText();
-			this.start = this.i + 1;
-			this.state = this.TagName;
-		} else if (next == '/') {
-			this.setText();
-			if (isLetter(this.data[++this.i + 1])) {
-				this.start = this.i + 1;
-				this.state = this.EndTag;
-			} else this.Comment();
-		} else if (next == '!' || next == '?') {
-			this.setText();
-			this.Comment();
-		}
-	}
-}
-MpHtmlParser.prototype.Comment = function() {
-	var key;
-	if (this.data.substring(this.i + 2, this.i + 4) == '--') key = '-->';
-	else if (this.data.substring(this.i + 2, this.i + 9) == '[CDATA[') key = ']]>';
-	else key = '>';
-	if ((this.i = this.data.indexOf(key, this.i + 2)) == -1) this.i = this.data.length;
-	else this.i += key.length - 1;
-	this.start = this.i + 1;
-	this.state = this.Text;
-}
-MpHtmlParser.prototype.TagName = function(c) {
-	if (blankChar[c]) {
-		this.tagName = this.section();
-		while (blankChar[this.data[this.i]]) this.i++;
-		if (this.isClose()) this.setNode();
-		else {
-			this.start = this.i;
-			this.state = this.AttrName;
-		}
-	} else if (this.isClose()) {
-		this.tagName = this.section();
-		this.setNode();
-	}
-}
-MpHtmlParser.prototype.AttrName = function(c) {
-	if (c == '=' || blankChar[c] || this.isClose()) {
-		this.attrName = this.section();
-		if (blankChar[c])
-			while (blankChar[this.data[++this.i]]);
-		if (this.data[this.i] == '=') {
-			while (blankChar[this.data[++this.i]]);
-			this.start = this.i--;
-			this.state = this.AttrValue;
-		} else this.setAttr();
-	}
-}
-MpHtmlParser.prototype.AttrValue = function(c) {
-	if (c == '"' || c == "'") {
-		this.start++;
-		if ((this.i = this.data.indexOf(c, this.i + 1)) == -1) return this.i = this.data.length;
-		this.attrVal = this.section();
-		this.i++;
-	} else {
-		for (; !blankChar[this.data[this.i]] && !this.isClose(); this.i++);
-		this.attrVal = this.section();
-	}
-	this.setAttr();
-}
-MpHtmlParser.prototype.EndTag = function(c) {
-	if (blankChar[c] || c == '>' || c == '/') {
-		var name = this.section().toLowerCase();
-		for (var i = this.STACK.length; i--;)
-			if (this.STACK[i].name == name) break;
-		if (i != -1) {
-			var node;
-			while ((node = this.STACK.pop()).name != name) this.popNode(node);
-			this.popNode(node);
-		} else if (name == 'p' || name == 'br')
-			this.siblings().push({
-				name,
-				attrs: {}
-			});
-		this.i = this.data.indexOf('>', this.i);
-		this.start = this.i + 1;
-		if (this.i == -1) this.i = this.data.length;
-		else this.state = this.Text;
-	}
-}
-module.exports = MpHtmlParser;

components/jyf-parser/libs/config.js

@@ -1,80 +0,0 @@
-/* 配置文件 */
-var cfg = {
-	// 出错占位图
-	errorImg: null,
-	// 过滤器函数
-	filter: null,
-	// 代码高亮函数
-	highlight: null,
-	// 文本处理函数
-	onText: null,
-	// 实体编码列表
-	entities: {
-		quot: '"',
-		apos: "'",
-		semi: ';',
-		nbsp: '\xA0',
-		ensp: '\u2002',
-		emsp: '\u2003',
-		ndash: '–',
-		mdash: '—',
-		middot: '·',
-		lsquo: '‘',
-		rsquo: '’',
-		ldquo: '“',
-		rdquo: '”',
-		bull: '•',
-		hellip: '…'
-	},
-	blankChar: makeMap(' ,\xA0,\t,\r,\n,\f'),
-	boolAttrs: makeMap('allowfullscreen,autoplay,autostart,controls,ignore,loop,muted'),
-	// 块级标签，将被转为 div
-	blockTags: makeMap('address,article,aside,body,caption,center,cite,footer,header,html,nav,pre,section'),
-	// 将被移除的标签
-	ignoreTags: makeMap('area,base,canvas,frame,iframe,input,link,map,meta,param,script,source,style,svg,textarea,title,track,wbr'),
-	// 只能被 rich-text 显示的标签
-	richOnlyTags: makeMap('a,colgroup,fieldset,legend'),
-	// 自闭合的标签
-	selfClosingTags: makeMap('area,base,br,col,circle,ellipse,embed,frame,hr,img,input,line,link,meta,param,path,polygon,rect,source,track,use,wbr'),
-	// 信任的标签
-	trustTags: makeMap('a,abbr,ad,audio,b,blockquote,br,code,col,colgroup,dd,del,dl,dt,div,em,fieldset,h1,h2,h3,h4,h5,h6,hr,i,img,ins,label,legend,li,ol,p,q,source,span,strong,sub,sup,table,tbody,td,tfoot,th,thead,tr,title,ul,video'),
-	// 默认的标签样式
-	userAgentStyles: {
-		address: 'font-style:italic',
-		big: 'display:inline;font-size:1.2em',
-		blockquote: 'background-color:#f6f6f6;border-left:3px solid #dbdbdb;color:#6c6c6c;padding:5px 0 5px 10px',
-		caption: 'display:table-caption;text-align:center',
-		center: 'text-align:center',
-		cite: 'font-style:italic',
-		dd: 'margin-left:40px',
-		mark: 'background-color:yellow',
-		pre: 'font-family:monospace;white-space:pre;overflow:scroll',
-		s: 'text-decoration:line-through',
-		small: 'display:inline;font-size:0.8em',
-		u: 'text-decoration:underline'
-	}
-}
-
-function makeMap(str) {
-	var map = Object.create(null),
-		list = str.split(',');
-	for (var i = list.length; i--;)
-		map[list[i]] = true;
-	return map;
-}
-
-// #ifdef MP-WEIXIN
-if (wx.canIUse('editor')) {
-	cfg.blockTags.pre = void 0;
-	cfg.ignoreTags.rp = true;
-	Object.assign(cfg.richOnlyTags, makeMap('bdi,bdo,caption,rt,ruby'));
-	Object.assign(cfg.trustTags, makeMap('bdi,bdo,caption,pre,rt,ruby'));
-}
-// #endif
-
-// #ifdef APP-PLUS
-cfg.ignoreTags.iframe = void 0;
-Object.assign(cfg.trustTags, makeMap('embed,iframe'));
-// #endif
-
-module.exports = cfg;

components/jyf-parser/libs/handler.wxs

@@ -1,22 +0,0 @@
-var inline = {
-	abbr: 1,
-	b: 1,
-	big: 1,
-	code: 1,
-	del: 1,
-	em: 1,
-	i: 1,
-	ins: 1,
-	label: 1,
-	q: 1,
-	small: 1,
-	span: 1,
-	strong: 1,
-	sub: 1,
-	sup: 1
-}
-module.exports = {
-	use: function(item) {
-		return !item.c && !inline[item.name] && (item.attrs.style || '').indexOf('display:inline') == -1
-	}
-}

components/jyf-parser/libs/trees.vue

@@ -1,506 +0,0 @@
-<template>
-	<view :class="'interlayer '+(c||'')" :style="s">
-		<block v-for="(n, i) in nodes" v-bind:key="i">
-			<!--图片-->
-			<view v-if="n.name=='img'" :class="'_img '+n.attrs.class" :style="n.attrs.style" :data-attrs="n.attrs" @tap.stop="imgtap">
-				<rich-text v-if="ctrl[i]!=0" :nodes="[{attrs:{src:loading&&(ctrl[i]||0)<2?loading:(lazyLoad&&!ctrl[i]?placeholder:(ctrl[i]==3?errorImg:n.attrs.src||'')),alt:n.attrs.alt||'',width:n.attrs.width||'',style:'-webkit-touch-callout:none;max-width:100%;display:block'+(n.attrs.height?';height:'+n.attrs.height:'')},name:'img'}]" />
-				<image class="_image" :src="lazyLoad&&!ctrl[i]?placeholder:n.attrs.src" :lazy-load="lazyLoad"
-				 :show-menu-by-longpress="!n.attrs.ignore" :data-i="i" :data-index="n.attrs.i" data-source="img" @load="loadImg"
-				 @error="error" />
-			</view>
-			<!--文本-->
-			<text v-else-if="n.type=='text'" decode>{{n.text}}</text>
-			<!--#ifndef MP-BAIDU-->
-			<text v-else-if="n.name=='br'">\n</text>
-			<!--#endif-->
-			<!--视频-->
-			<view v-else-if="((n.lazyLoad&&!n.attrs.autoplay)||(n.name=='video'&&!loadVideo))&&ctrl[i]==undefined" :id="n.attrs.id"
-			 :class="'_video '+(n.attrs.class||'')" :style="n.attrs.style" :data-i="i" @tap.stop="_loadVideo" />
-			<video v-else-if="n.name=='video'" :id="n.attrs.id" :class="n.attrs.class" :style="n.attrs.style" :autoplay="n.attrs.autoplay||ctrl[i]==0"
-			 :controls="n.attrs.controls" :loop="n.attrs.loop" :muted="n.attrs.muted" :poster="n.attrs.poster" :src="n.attrs.source[ctrl[i]||0]"
-			 :unit-id="n.attrs['unit-id']" :data-id="n.attrs.id" :data-i="i" data-source="video" @error="error" @play="play" />
-			<!--音频-->
-			<audio v-else-if="n.name=='audio'" :ref="n.attrs.id" :class="n.attrs.class" :style="n.attrs.style" :author="n.attrs.author"
-			 :autoplay="n.attrs.autoplay" :controls="n.attrs.controls" :loop="n.attrs.loop" :name="n.attrs.name" :poster="n.attrs.poster"
-			 :src="n.attrs.source[ctrl[i]||0]" :data-i="i" :data-id="n.attrs.id" data-source="audio" @error.native="error"
-			 @play.native="play" />
-			<!--链接-->
-			<view v-else-if="n.name=='a'" :id="n.attrs.id" :class="'_a '+(n.attrs.class||'')" hover-class="_hover" :style="n.attrs.style"
-			 :data-attrs="n.attrs" @tap.stop="linkpress">
-				<trees class="_span" c="_span" :nodes="n.children" />
-			</view>
-			<!--广告-->
-			<!--<ad v-else-if="n.name=='ad'" :class="n.attrs.class" :style="n.attrs.style" :unit-id="n.attrs['unit-id']" :appid="n.attrs.appid" :apid="n.attrs.apid" :type="n.attrs.type" :adpid="n.attrs.adpid" data-source="ad" @error="error" />-->
-			<!--列表-->
-			<view v-else-if="n.name=='li'" :id="n.attrs.id" :class="n.attrs.class" :style="(n.attrs.style||'')+';display:flex;flex-direction:row'">
-				<view v-if="n.type=='ol'" class="_ol-bef">{{n.num}}</view>
-				<view v-else class="_ul-bef">
-					<view v-if="n.floor%3==0" class="_ul-p1">█</view>
-					<view v-else-if="n.floor%3==2" class="_ul-p2" />
-					<view v-else class="_ul-p1" style="border-radius:50%">█</view>
-				</view>
-				<trees class="_li" c="_li" :nodes="n.children" :lazyLoad="lazyLoad" :loading="loading" />
-			</view>
-			<!--表格-->
-			<view v-else-if="n.name=='table'&&n.c&&n.flag" :id="n.attrs.id" :class="n.attrs.class" :style="(n.attrs.style||'')+';display:grid'">
-				<trees v-for="(cell,n) in n.children" v-bind:key="n" :class="cell.attrs.class" :c="cell.attrs.class" :style="cell.attrs.style"
-				 :s="cell.attrs.style" :nodes="cell.children" />
-			</view>
-			<view v-else-if="n.name=='table'&&n.c" :id="n.attrs.id" :class="n.attrs.class" :style="(n.attrs.style||'')+';display:table'">
-				<view v-for="(tbody, o) in n.children" v-bind:key="o" :class="tbody.attrs.class" :style="(tbody.attrs.style||'')+(tbody.name[0]=='t'?';display:table-'+(tbody.name=='tr'?'row':'row-group'):'')">
-					<view v-for="(tr, p) in tbody.children" v-bind:key="p" :class="tr.attrs.class" :style="(tr.attrs.style||'')+(tr.name[0]=='t'?';display:table-'+(tr.name=='tr'?'row':'cell'):'')">
-						<trees v-if="tr.name=='td'" :nodes="tr.children" />
-						<trees v-else v-for="(td, q) in tr.children" v-bind:key="q" :class="td.attrs.class" :c="td.attrs.class" :style="(td.attrs.style||'')+(td.name[0]=='t'?';display:table-'+(td.name=='tr'?'row':'cell'):'')"
-						 :s="(td.attrs.style||'')+(td.name[0]=='t'?';display:table-'+(td.name=='tr'?'row':'cell'):'')" :nodes="td.children" />
-					</view>
-				</view>
-			</view>
-			<!--#ifdef APP-PLUS-->
-			<iframe v-else-if="n.name=='iframe'" :style="n.attrs.style" :allowfullscreen="n.attrs.allowfullscreen" :frameborder="n.attrs.frameborder"
-			 :width="n.attrs.width" :height="n.attrs.height" :src="n.attrs.src" />
-			<embed v-else-if="n.name=='embed'" :style="n.attrs.style" :width="n.attrs.width" :height="n.attrs.height" :src="n.attrs.src" />
-			<!--#endif-->
-			<!--富文本-->
-			<!--#ifdef MP-WEIXIN || MP-QQ || APP-PLUS-->
-			<rich-text v-else-if="handler.use(n)" :id="n.attrs.id" :class="'_p __'+n.name" :nodes="[n]" />
-			<!--#endif-->
-			<!--#ifndef MP-WEIXIN || MP-QQ || APP-PLUS-->
-			<rich-text v-else-if="!n.c" :id="n.attrs.id" :nodes="[n]" style="display:inline" />
-			<!--#endif-->
-			<trees v-else :class="(n.attrs.id||'')+' _'+n.name+' '+(n.attrs.class||'')" :c="(n.attrs.id||'')+' _'+n.name+' '+(n.attrs.class||'')"
-			 :style="n.attrs.style" :s="n.attrs.style" :nodes="n.children" :lazyLoad="lazyLoad" :loading="loading" />
-		</block>
-	</view>
-</template>
-<script module="handler" lang="wxs" src="./handler.wxs"></script>
-<script>
-	global.Parser = {};
-	import trees from './trees'
-	const errorImg = require('../libs/config.js').errorImg;
-	export default {
-		components: {
-			trees
-		},
-		name: 'trees',
-		data() {
-			return {
-				ctrl: [],
-				placeholder: 'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="300" height="225"/>',
-				errorImg,
-				loadVideo: typeof plus == 'undefined',
-				// #ifndef MP-ALIPAY
-				c: '',
-				s: ''
-				// #endif
-			}
-		},
-		props: {
-			nodes: Array,
-			lazyLoad: Boolean,
-			loading: String,
-			// #ifdef MP-ALIPAY
-			c: String,
-			s: String
-			// #endif
-		},
-		mounted() {
-			for (this.top = this.$parent; this.top.$options.name != 'parser'; this.top = this.top.$parent);
-			this.init();
-		},
-		// #ifdef APP-PLUS
-		beforeDestroy() {
-			this.observer && this.observer.disconnect();
-		},
-		// #endif
-		methods: {
-			init() {
-				for (var i = this.nodes.length, n; n = this.nodes[--i];) {
-					if (n.name == 'img') {
-						this.top.imgList.setItem(n.attrs.i, n.attrs['original-src'] || n.attrs.src);
-						// #ifdef APP-PLUS
-						if (this.lazyLoad && !this.observer) {
-							this.observer = uni.createIntersectionObserver(this).relativeToViewport({
-								top: 500,
-								bottom: 500
-							});
-							setTimeout(() => {
-								this.observer.observe('._img', res => {
-									if (res.intersectionRatio) {
-										for (var j = this.nodes.length; j--;)
-											if (this.nodes[j].name == 'img')
-												this.$set(this.ctrl, j, 1);
-										this.observer.disconnect();
-									}
-								})
-							}, 0)
-						}
-						// #endif
-					} else if (n.name == 'video' || n.name == 'audio') {
-						var ctx;
-						if (n.name == 'video') {
-							ctx = uni.createVideoContext(n.attrs.id
-								// #ifndef MP-BAIDU
-								, this
-								// #endif
-							);
-						} else if (this.$refs[n.attrs.id])
-							ctx = this.$refs[n.attrs.id][0];
-						if (ctx) {
-							ctx.id = n.attrs.id;
-							this.top.videoContexts.push(ctx);
-						}
-					}
-				}
-				// #ifdef APP-PLUS
-				// APP 上避免 video 错位需要延时渲染
-				setTimeout(() => {
-					this.loadVideo = true;
-				}, 1000)
-				// #endif
-			},
-			play(e) {
-				var contexts = this.top.videoContexts;
-				if (contexts.length > 1 && this.top.autopause)
-					for (var i = contexts.length; i--;)
-						if (contexts[i].id != e.currentTarget.dataset.id)
-							contexts[i].pause();
-			},
-			imgtap(e) {
-				var attrs = e.currentTarget.dataset.attrs;
-				if (!attrs.ignore) {
-					var preview = true,
-						data = {
-							id: e.target.id,
-							src: attrs.src,
-							ignore: () => preview = false
-						};
-					global.Parser.onImgtap && global.Parser.onImgtap(data);
-					this.top.$emit('imgtap', data);
-					if (preview) {
-						var urls = this.top.imgList,
-							current = urls[attrs.i] ? parseInt(attrs.i) : (urls = [attrs.src], 0);
-						uni.previewImage({
-							current,
-							urls
-						})
-					}
-				}
-			},
-			loadImg(e) {
-				var i = e.currentTarget.dataset.i;
-				if (this.lazyLoad && !this.ctrl[i]) {
-					// #ifdef QUICKAPP-WEBVIEW
-					this.$set(this.ctrl, i, 0);
-					this.$nextTick(function() {
-						// #endif
-						// #ifndef APP-PLUS
-						this.$set(this.ctrl, i, 1);
-						// #endif
-						// #ifdef QUICKAPP-WEBVIEW
-					})
-					// #endif
-				} else if (this.loading && this.ctrl[i] != 2) {
-					// #ifdef QUICKAPP-WEBVIEW
-					this.$set(this.ctrl, i, 0);
-					this.$nextTick(function() {
-						// #endif
-						this.$set(this.ctrl, i, 2);
-						// #ifdef QUICKAPP-WEBVIEW
-					})
-					// #endif
-				}
-			},
-			linkpress(e) {
-				var jump = true,
-					attrs = e.currentTarget.dataset.attrs;
-				attrs.ignore = () => jump = false;
-				global.Parser.onLinkpress && global.Parser.onLinkpress(attrs);
-				this.top.$emit('linkpress', attrs);
-				if (jump) {
-					// #ifdef MP
-					if (attrs['app-id']) {
-						return uni.navigateToMiniProgram({
-							appId: attrs['app-id'],
-							path: attrs.path
-						})
-					}
-					// #endif
-					if (attrs.href) {
-						if (attrs.href[0] == '#') {
-							if (this.top.useAnchor)
-								this.top.navigateTo({
-									id: attrs.href.substring(1)
-								})
-						} else if (attrs.href.indexOf('http') == 0 || attrs.href.indexOf('//') == 0) {
-							// #ifdef APP-PLUS
-							plus.runtime.openWeb(attrs.href);
-							// #endif
-							// #ifndef APP-PLUS
-							uni.setClipboardData({
-								data: attrs.href,
-								success: () =>
-									uni.showToast({
-										title: '链接已复制'
-									})
-							})
-							// #endif
-						} else
-							uni.navigateTo({
-								url: attrs.href,
-								fail() {
-									uni.switchTab({
-										url: attrs.href,
-									})
-								}
-							})
-					}
-				}
-			},
-			error(e) {
-				var target = e.currentTarget,
-					source = target.dataset.source,
-					i = target.dataset.i;
-				if (source == 'video' || source == 'audio') {
-					// 加载其他 source
-					var index = this.ctrl[i] ? this.ctrl[i].i + 1 : 1;
-					if (index < this.nodes[i].attrs.source.length)
-						this.$set(this.ctrl, i, index);
-					if (e.detail.__args__)
-						e.detail = e.detail.__args__[0];
-				} else if (errorImg && source == 'img') {
-					this.top.imgList.setItem(target.dataset.index, errorImg);
-					this.$set(this.ctrl, i, 3);
-				}
-				this.top && this.top.$emit('error', {
-					source,
-					target,
-					errMsg: e.detail.errMsg
-				});
-			},
-			_loadVideo(e) {
-				this.$set(this.ctrl, e.target.dataset.i, 0);
-			}
-		}
-	}
-</script>
-
-<style>
-	/* 在这里引入自定义样式 */
-
-	/* 链接和图片效果 */
-	._a {
-		display: inline;
-		padding: 1.5px 0 1.5px 0;
-		color: #366092;
-		word-break: break-all;
-	}
-
-	._hover {
-		text-decoration: underline;
-		opacity: 0.7;
-	}
-
-	._img {
-		/* display: inline-block; */
-    display: block;
-		max-width: 100%;
-		overflow: hidden;
-	}
-
-	/* #ifdef MP-WEIXIN */
-	:host {
-		display: inline;
-	}
-
-	/* #endif */
-
-	/* #ifndef MP-ALIPAY || APP-PLUS */
-	.interlayer {
-		display: inherit;
-		flex-direction: inherit;
-		flex-wrap: inherit;
-		align-content: inherit;
-		align-items: inherit;
-		justify-content: inherit;
-		width: 100%;
-		white-space: inherit;
-	}
-
-	/* #endif */
-
-	._b,
-	._strong {
-		font-weight: bold;
-	}
-
-	/* #ifndef MP-ALIPAY */
-	._blockquote,
-	._div,
-	._p,
-	._ol,
-	._ul,
-	._li {
-		display: block;
-	}
-
-	/* #endif */
-
-	._code {
-		font-family: monospace;
-	}
-
-	._del {
-		text-decoration: line-through;
-	}
-
-	._em,
-	._i {
-		font-style: italic;
-	}
-
-	._h1 {
-		font-size: 2em;
-	}
-
-	._h2 {
-		font-size: 1.5em;
-	}
-
-	._h3 {
-		font-size: 1.17em;
-	}
-
-	._h5 {
-		font-size: 0.83em;
-	}
-
-	._h6 {
-		font-size: 0.67em;
-	}
-
-	._h1,
-	._h2,
-	._h3,
-	._h4,
-	._h5,
-	._h6 {
-		display: block;
-		font-weight: bold;
-	}
-
-	._image {
-		display: block;
-		width: 100%;
-		height: 360px;
-		margin-top: -360px;
-		opacity: 0;
-	}
-
-	._ins {
-		text-decoration: underline;
-	}
-
-	._li {
-		flex: 1;
-		width: 0;
-	}
-
-	._ol-bef {
-		width: 36px;
-		margin-right: 5px;
-		text-align: right;
-	}
-
-	._ul-bef {
-		display: block;
-		margin: 0 12px 0 23px;
-		line-height: normal;
-	}
-
-	._ol-bef,
-	._ul-bef {
-		flex: none;
-		user-select: none;
-	}
-
-	._ul-p1 {
-		display: inline-block;
-		width: 0.3em;
-		height: 0.3em;
-		overflow: hidden;
-		line-height: 0.3em;
-	}
-
-	._ul-p2 {
-		display: inline-block;
-		width: 0.23em;
-		height: 0.23em;
-		border: 0.05em solid black;
-		border-radius: 50%;
-	}
-
-	._q::before {
-		content: '"';
-	}
-
-	._q::after {
-		content: '"';
-	}
-
-	._sub {
-		font-size: smaller;
-		vertical-align: sub;
-	}
-
-	._sup {
-		font-size: smaller;
-		vertical-align: super;
-	}
-
-	/* #ifdef MP-ALIPAY || APP-PLUS || QUICKAPP-WEBVIEW */
-	._abbr,
-	._b,
-	._code,
-	._del,
-	._em,
-	._i,
-	._ins,
-	._label,
-	._q,
-	._span,
-	._strong,
-	._sub,
-	._sup {
-		display: inline;
-	}
-
-	/* #endif */
-
-	/* #ifdef MP-WEIXIN || MP-QQ */
-	.__bdo,
-	.__bdi,
-	.__ruby,
-	.__rt {
-		display: inline-block;
-	}
-
-	/* #endif */
-	._video {
-		position: relative;
-		display: inline-block;
-		width: 300px;
-		height: 225px;
-		background-color: black;
-	}
-
-	._video::after {
-		position: absolute;
-		top: 50%;
-		left: 50%;
-		margin: -15px 0 0 -15px;
-		content: '';
-		border-color: transparent transparent transparent white;
-		border-style: solid;
-		border-width: 15px 0 15px 30px;
-	}
-</style>

components/page/diyComponents/richText/index.vue

@@ -0,0 +1,33 @@
+<template>
+  <!-- 富文本 -->
+  <view class="diy-richText"
+    :style="{ padding: `${itemStyle.paddingTop}px ${itemStyle.paddingLeft}px`, background: itemStyle.background }">
+    <mp-html :content="params.content" />
+  </view>
+</template>
+
+<script>
+  export default {
+    /**
+     * 组件的属性列表
+     * 用于组件自定义设置
+     */
+    props: {
+      itemStyle: Object,
+      params: Object
+    },
+    /**
+     * 组件的方法列表
+     * 更新属性和数据的方法与更新页面数据的方法类似
+     */
+    methods: {
+
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .diy-richText {
+    font-size: 28rpx;
+  }
+</style>

pages/article/detail.vue

@@ -12,7 +12,7 @@
       </view>
     </view>
     <view class="article-content m-top20">
-      <jyf-parser :html="detail.content"></jyf-parser>
+      <mp-html :content="detail.content" />
     </view>
     <!-- 快捷导航 -->
     <shortcut />
@@ -20,7 +20,6 @@
 </template>
 
 <script>
-  import jyfParser from '@/components/jyf-parser/jyf-parser'
   import Shortcut from '@/components/shortcut'
   import * as ArticleApi from '@/api/article'
 

pages/goods/detail.vue

@@ -75,7 +75,7 @@
       </view>
       <block v-if="goods.content != ''">
         <view class="goods-content__detail b-f">
-          <jyf-parser :html="goods.content"></jyf-parser>
+          <mp-html :content="goods.content" />
         </view>
       </block>
       <empty v-else tips="亲，暂无商品描述" />
@@ -145,8 +145,7 @@
 <script>
   import * as GoodsApi from '@/api/goods'
   import * as CartApi from '@/api/cart'
-  import jyfParser from '@/components/jyf-parser/jyf-parser'
-  import Shortcut from '@/components/shortcut'
+  // import Shortcut from '@/components/shortcut'
   import SlideImage from './components/SlideImage'
   import SkuPopup from './components/SkuPopup'
   import Comment from './components/Comment'
@@ -154,8 +153,7 @@
 
   export default {
     components: {
-      jyfParser,
-      Shortcut,
+      // Shortcut,
       SlideImage,
       SkuPopup,
       Comment,

uni_modules/mp-html/README.md

@@ -0,0 +1,182 @@
+## 功能介绍
+- 全端支持（含 `v3、NVUE`）
+- 支持丰富的标签（包括 `table`、`video`、`svg` 等）
+- 支持丰富的事件效果（自动预览图片、链接处理等）
+- 支持设置占位图（加载中、出错时、预览时）
+- 支持锚点跳转、长按复制等丰富功能
+- 支持大部分 *html* 实体
+- 丰富的插件（关键词搜索、内容 **编辑** 等）
+- 效率高、容错性强且轻量化
+
+查看 [功能介绍](https://jin-yufeng.gitee.io/mp-html/#/overview/feature) 了解更多
+
+## 使用方法
+- `uni_modules` 方式  
+  1. 点击右上角的 `使用 HBuilder X 导入插件` 按钮直接导入项目或点击 `下载插件 ZIP` 按钮下载插件包并解压到项目的 `uni_modules/mp-html` 目录下  
+  2. 在需要使用页面的 `(n)vue` 文件中添加  
+     ```html
+     <!-- 不需要引入，可直接使用 -->
+     <mp-html :content="html" />
+     ```
+     ```javascript
+     export default {
+       data() {
+         return {
+           html: '<div>Hello World!</div>'
+         }
+       }
+     }
+     ```
+  3. 需要更新版本时在 `HBuilder X` 中右键 `uni_modules/mp-html` 目录选择 `从插件市场更新` 即可  
+
+- 源码方式  
+  1. 从 [github](https://github.com/jin-yufeng/mp-html/tree/master/dist/uni-app) 或 [gitee](https://gitee.com/jin-yufeng/mp-html/tree/master/dist/uni-app) 下载源码  
+     插件市场的 **非 uni_modules 版本** 无法更新，不建议从插件市场获取  
+  2. 在需要使用页面的 `(n)vue` 文件中添加  
+     ```html
+     <mp-html :content="html" />
+     ```
+     ```javascript
+     import mpHtml from '@/components/mp-html/mp-html'
+     export default {
+       // HBuilderX 2.5.5+ 可以通过 easycom 自动引入
+       components: {
+         mpHtml
+       },
+       data() {
+         return {
+           html: '<div>Hello World!</div>'
+         }
+       }
+     }
+     ```
+
+- npm 方式  
+  1. 在项目根目录下执行  
+     ```bash
+     npm install mp-html
+     ```
+  2. 在需要使用页面的 `(n)vue` 文件中添加  
+     ```html
+     <mp-html :content="html" />
+     ```
+     ```javascript
+     import mpHtml from 'mp-html/dist/uni-app/components/mp-html/mp-html'
+     export default {
+       // 不可省略
+       components: {
+         mpHtml
+       },
+       data() {
+         return {
+           html: '<div>Hello World!</div>'
+         }
+       }
+     }
+     ```
+  3. 需要更新版本时执行以下命令即可  
+     ```bash
+     npm update mp-html
+     ```
+  
+  使用 *cli* 方式运行的项目，通过 *npm* 方式引入时，需要在 *vue.config.js* 中配置 *transpileDependencies*，详情可见 [#330](https://github.com/jin-yufeng/mp-html/issues/330#issuecomment-913617687)  
+  如果在 **nvue** 中使用还要将 `dist/uni-app/static` 目录下的内容拷贝到项目的 `static` 目录下，否则无法运行  
+
+查看 [快速开始](https://jin-yufeng.gitee.io/mp-html/#/overview/quickstart) 了解更多
+
+## 组件属性
+
+| 属性 | 类型 | 默认值 | 说明 |
+|:---:|:---:|:---:|---|
+| container-style | String |  | 容器的样式（[2.1.0+](https://jin-yufeng.gitee.io/mp-html/#/changelog/changelog#v210)） |
+| content | String |  | 用于渲染的 html 字符串 |
+| copy-link | Boolean | true | 是否允许外部链接被点击时自动复制 |
+| domain | String |  | 主域名（用于链接拼接） |
+| error-img | String |  | 图片出错时的占位图链接 |
+| lazy-load | Boolean | false | 是否开启图片懒加载 |
+| loading-img | String |  | 图片加载过程中的占位图链接 |
+| pause-video | Boolean | true | 是否在播放一个视频时自动暂停其他视频 |
+| preview-img | Boolean | true | 是否允许图片被点击时自动预览 |
+| scroll-table | Boolean | false | 是否给每个表格添加一个滚动层使其能单独横向滚动 |
+| selectable | Boolean | false | 是否开启文本长按复制 |
+| set-title | Boolean | true | 是否将 title 标签的内容设置到页面标题 |
+| show-img-menu | Boolean | true | 是否允许图片被长按时显示菜单 |
+| tag-style | Object |  | 设置标签的默认样式 |
+| use-anchor | Boolean | false | 是否使用锚点链接 |
+
+查看 [属性](https://jin-yufeng.gitee.io/mp-html/#/basic/prop) 了解更多
+
+## 组件事件
+
+| 名称 | 触发时机 |
+|:---:|---|
+| load | dom 树加载完毕时 |
+| ready | 图片加载完毕时 |
+| error | 发生渲染错误时 |
+| imgtap | 图片被点击时 |
+| linktap | 链接被点击时 |
+
+查看 [事件](https://jin-yufeng.gitee.io/mp-html/#/basic/event) 了解更多
+
+## api
+组件实例上提供了一些 `api` 方法可供调用
+
+| 名称 | 作用 |
+|:---:|---|
+| in | 将锚点跳转的范围限定在一个 scroll-view 内 |
+| navigateTo | 锚点跳转 |
+| getText | 获取文本内容 |
+| getRect | 获取富文本内容的位置和大小 |
+| setContent | 设置富文本内容 |
+| imgList | 获取所有图片的数组 |
+
+查看 [api](https://jin-yufeng.gitee.io/mp-html/#/advanced/api) 了解更多
+
+## 插件扩展  
+除基本功能外，本组件还提供了丰富的扩展，可按照需要选用
+
+| 名称 | 作用 |
+|:---:|---|
+| audio | 音乐播放器 |
+| editable | 富文本 **编辑**（[示例项目](https://6874-html-foe72-1259071903.tcb.qcloud.la/editable.zip?sign=cc0017be203fb3dbca62d33a0c15792e&t=1608447445)） |
+| emoji | 解析 emoji |
+| highlight | 代码块高亮显示 |
+| markdown | 渲染 markdown |
+| search | 关键词搜索 |
+| style | 匹配 style 标签中的样式 |
+| txv-video | 使用腾讯视频 |
+| img-cache | 图片缓存 by [@PentaTea](https://github.com/PentaTea) |
+
+从插件市场导入的包中 **不含有** 扩展插件，需要使用插件参考以下方法：  
+1. 获取完整组件包  
+   ```bash
+   npm install mp-html
+   ```
+2. 编辑 `tools/config.js` 中的 `plugins` 项，选择需要的插件  
+3. 生成新的组件包  
+   在 `node_modules/mp-html` 目录下执行  
+   ```bash
+   npm install
+   npm run build:uni-app
+   ```
+4. 拷贝 `dist/uni-app` 中的内容到项目根目录  
+
+查看 [插件](https://jin-yufeng.gitee.io/mp-html/#/advanced/plugin) 了解更多
+
+## 示例体验
+![富文本插件](https://gitee.com/jin-yufeng/mp-html/raw/master/docs/assets/case/富文本插件.jpg)
+
+## 关于 nvue
+`nvue` 使用原生渲染，不支持部分 `css` 样式，为实现和 `html` 相同的效果，组件内部通过 `web-view` 进行渲染，性能上差于原生，根据 `weex` 官方建议，`web` 标签仅应用在非常规的降级场景。因此，如果通过原生的方式（如 `richtext`）能够满足需要，则不建议使用本组件，如果有较多的富文本内容，则可以直接使用 `vue` 页面  
+由于渲染方式与其他端不同，有以下限制：  
+1. 不支持 `lazy-load` 属性
+2. 视频不支持全屏播放
+
+纯 `nvue` 模式下，[此问题](https://ask.dcloud.net.cn/question/119678) 修复前，不支持通过 `uni_modules` 引入，需要本地引入（将 [dist/uni-app](https://github.com/jin-yufeng/mp-html/tree/master/dist/uni-app) 中的内容拷贝到项目根目录下）  
+
+## 问题反馈
+遇到问题时，请先查阅 [常见问题](https://jin-yufeng.gitee.io/mp-html/#/question/faq) 和 [issue](https://github.com/jin-yufeng/mp-html/issues) 中是否已有相同的问题  
+可通过 [issue](https://github.com/jin-yufeng/mp-html/issues/new/choose) 、插件问答或发送邮件到 [mp_html@126.com](mailto:mp_html@126.com) 提问，不建议在评论区提问（不方便回复）  
+提问请严格按照 [issue 模板](https://github.com/jin-yufeng/mp-html/issues/new/choose) ，描述清楚使用环境、`html` 内容或可复现的 `demo` 项目以及复现方式，对于 **描述不清**、**无法复现** 或重复的问题将不予回复  
+
+查看 [问题反馈](https://jin-yufeng.gitee.io/mp-html/#/question/feedback) 了解更多

uni_modules/mp-html/changelog.md

@@ -0,0 +1,69 @@
+## v2.2.1（2021-12-24）
+1. `A` `editable` 插件增加上下移动标签功能
+2. `U` `editable` 插件支持在文本中间光标处插入内容
+3. `F` 修复了 `nvue` 端设置 `margin` 后可能导致高度不正确的问题
+4. `F` 修复了 `highlight` 插件使用压缩版的 `prism.css` 可能导致背景失效的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/367)
+5. `F` 修复了编辑状态下使用 `emoji` 插件内容为空时可能报错的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/371)
+6. `F` 修复了使用 `editable` 插件后将 `selectable` 属性设置为 `force` 不生效的问题
+## v2.2.0（2021-10-12）
+1. `A` 增加 `customElements` 配置项，便于添加自定义功能性标签 [详细](https://github.com/jin-yufeng/mp-html/issues/350)
+2. `A` `editable` 插件增加切换音视频自动播放状态的功能 [详细](https://github.com/jin-yufeng/mp-html/pull/341) by [@leeseett](https://github.com/leeseett)
+3. `A` `editable` 插件删除媒体标签时触发 `remove` 事件，便于删除已上传的文件
+4. `U` `editable` 插件 `insertImg` 方法支持同时插入多张图片 [详细](https://github.com/jin-yufeng/mp-html/issues/342)
+5. `U` `editable` 插入图片和音视频时支持拼接 `domian` 主域名
+6. `F` 修复了内部链接参数中包含 `://` 时被认为是外部链接的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/356)
+7. `F` 修复了部分 `svg` 标签名或属性名大小写不正确时不生效的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/351)
+8. `F` 修复了 `nvue` 页面运行到非 `app` 平台时可能样式错误的问题
+## v2.1.5（2021-08-13）
+1. `A` 增加支持标签的 `dir` 属性
+2. `F` 修复了 `ruby` 标签文字与拼音没有居中对齐的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/325)
+3. `F` 修复了音视频标签内有 `a` 标签时可能无法播放的问题
+4. `F` 修复了 `externStyle` 中的 `class` 名包含下划线或数字时可能失效的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/326)
+5. `F` 修复了 `h5` 端引入 `externStyle` 可能不生效的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/326)
+## v2.1.4（2021-07-14）
+1. `F` 修复了 `rt` 标签无法设置样式的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/318)
+2. `F` 修复了表格中有单元格同时合并行和列时可能显示不正确的问题
+3. `F` 修复了 `app` 端无法关闭图片长按菜单的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/322)
+4. `F` 修复了 `editable` 插件只能添加图片链接不能修改的问题 [详细](https://github.com/jin-yufeng/mp-html/pull/312) by [@leeseett](https://github.com/leeseett)
+## v2.1.3（2021-06-12）
+1. `A` `editable` 插件增加 `insertTable` 方法
+2. `U` `editable` 插件支持编辑表格中的空白单元格 [详细](https://github.com/jin-yufeng/mp-html/issues/310)
+3. `F` 修复了 `externStyle` 中使用伪类可能失效的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/298)
+4. `F` 修复了多个组件同时使用时 `tag-style` 属性时可能互相影响的问题 [详细](https://github.com/jin-yufeng/mp-html/pull/305) by [@woodguoyu](https://github.com/woodguoyu)
+5. `F` 修复了包含 `linearGradient` 的 `svg` 可能无法显示的问题
+6. `F` 修复了编译到头条小程序时可能报错的问题
+7. `F` 修复了 `nvue` 端不触发 `click` 事件的问题
+8. `F` 修复了 `editable` 插件尾部插入时无法撤销的问题
+9. `F` 修复了 `editable` 插件的 `insertHtml` 方法只能在末尾插入的问题
+10. `F` 修复了 `editable` 插件插入音频不显示的问题
+## v2.1.2（2021-04-24）
+1. `A` 增加了 [img-cache](https://jin-yufeng.gitee.io/mp-html/#/advanced/plugin#img-cache) 插件，可以在 `app` 端缓存图片 [详细](https://github.com/jin-yufeng/mp-html/issues/292) by [@PentaTea](https://github.com/PentaTea)
+2. `U` 支持通过 `container-style` 属性设置 `white-space` 来保留连续空格和换行符 [详细](https://jin-yufeng.gitee.io/mp-html/#/question/faq#space)
+3. `U` 代码风格符合 [standard](https://standardjs.com) 标准
+4. `U` `editable` 插件编辑状态下支持预览视频 [详细](https://github.com/jin-yufeng/mp-html/issues/286)
+5. `F` 修复了 `svg` 标签内嵌 `svg` 时无法显示的问题
+6. `F` 修复了编译到支付宝和头条小程序时部分区域不可复制的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/291)
+## v2.1.1（2021-04-09）
+1. 修复了对 `p` 标签设置 `tag-style` 可能不生效的问题
+2. 修复了 `svg` 标签中的文本无法显示的问题
+3. 修复了使用 `editable` 插件编辑表格时可能报错的问题
+4. 修复了使用 `highlight` 插件运行到头条小程序时可能没有样式的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/280)
+5. 修复了使用 `editable` 插件 `editable` 属性为 `false` 时会报错的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/284)
+6. 修复了 `style` 插件连续子选择器失效的问题
+7. 修复了 `editable` 插件无法修改图片和字体大小的问题
+## v2.1.0.2（2021-03-21）
+修复了 `nvue` 端使用可能报错的问题
+## v2.1.0（2021-03-20）
+1. `A` 增加了 [container-style](https://jin-yufeng.gitee.io/mp-html/#/basic/prop#container-style) 属性 [详细](https://gitee.com/jin-yufeng/mp-html/pulls/1)
+2. `A` 增加支持 `strike` 标签
+3. `A` `editable` 插件增加 `placeholder` 属性 [详细](https://jin-yufeng.gitee.io/mp-html/#/advanced/plugin#editable)
+4. `A` `editable` 插件增加 `insertHtml` 方法 [详细](https://jin-yufeng.gitee.io/mp-html/#/advanced/plugin#editable)
+5. `U` 外部样式支持标签名选择器 [详细](https://jin-yufeng.gitee.io/mp-html/#/overview/quickstart#setting)
+6. `F` 修复了 `nvue` 端部分情况下可能不显示的问题
+## v2.0.5（2021-03-12）
+1. `U` [linktap](https://jin-yufeng.gitee.io/mp-html/#/basic/event#linktap) 事件增加返回内部文本内容 `innerText` [详细](https://github.com/jin-yufeng/mp-html/issues/271)
+2. `U` [selectable](https://jin-yufeng.gitee.io/mp-html/#/basic/prop#selectable) 属性设置为 `force` 时能够在微信 `iOS` 端生效（文本块会变成 `inline-block`） [详细](https://github.com/jin-yufeng/mp-html/issues/267)
+3. `F` 修复了部分情况下竖向无法滚动的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/182)
+4. `F` 修复了多次修改富文本数据时部分内容可能不显示的问题
+5. `F` 修复了 [腾讯视频](https://jin-yufeng.gitee.io/mp-html/#/advanced/plugin#txv-video) 插件可能无法播放的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/265)
+6. `F` 修复了 [highlight](https://jin-yufeng.gitee.io/mp-html/#/advanced/plugin#highlight) 插件没有设置高亮语言时没有应用默认样式的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/276) by [@fuzui](https://github.com/fuzui)

uni_modules/mp-html/components/mp-html/mp-html.vue

@@ -0,0 +1,435 @@
+<template>
+  <view id="_root" :class="(selectable?'_select ':'')+'_root'" :style="containerStyle">
+    <slot v-if="!nodes[0]" />
+    <!-- #ifndef APP-PLUS-NVUE -->
+    <node v-else :childs="nodes" :opts="[lazyLoad,loadingImg,errorImg,showImgMenu]" name="span" />
+    <!-- #endif -->
+    <!-- #ifdef APP-PLUS-NVUE -->
+    <web-view ref="web" src="/uni_modules/mp-html/static/app-plus/mp-html/local.html" :style="'margin-top:-2px;height:' + height + 'px'" @onPostMessage="_onMessage" />
+    <!-- #endif -->
+  </view>
+</template>
+
+<script>
+/**
+ * mp-html v2.2.1
+ * @description 富文本组件
+ * @tutorial https://github.com/jin-yufeng/mp-html
+ * @property {String} container-style 容器的样式
+ * @property {String} content 用于渲染的 html 字符串
+ * @property {Boolean} copy-link 是否允许外部链接被点击时自动复制
+ * @property {String} domain 主域名，用于拼接链接
+ * @property {String} error-img 图片出错时的占位图链接
+ * @property {Boolean} lazy-load 是否开启图片懒加载
+ * @property {string} loading-img 图片加载过程中的占位图链接
+ * @property {Boolean} pause-video 是否在播放一个视频时自动暂停其他视频
+ * @property {Boolean} preview-img 是否允许图片被点击时自动预览
+ * @property {Boolean} scroll-table 是否给每个表格添加一个滚动层使其能单独横向滚动
+ * @property {Boolean | String} selectable 是否开启长按复制
+ * @property {Boolean} set-title 是否将 title 标签的内容设置到页面标题
+ * @property {Boolean} show-img-menu 是否允许图片被长按时显示菜单
+ * @property {Object} tag-style 标签的默认样式
+ * @property {Boolean | Number} use-anchor 是否使用锚点链接
+ * @event {Function} load dom 结构加载完毕时触发
+ * @event {Function} ready 所有图片加载完毕时触发
+ * @event {Function} imgTap 图片被点击时触发
+ * @event {Function} linkTap 链接被点击时触发
+ * @event {Function} error 媒体加载出错时触发
+ */
+// #ifndef APP-PLUS-NVUE
+import node from './node/node'
+// #endif
+const plugins=[]
+const Parser = require('./parser')
+// #ifdef APP-PLUS-NVUE
+const dom = weex.requireModule('dom')
+// #endif
+export default {
+  name: 'mp-html',
+  data () {
+    return {
+      nodes: [],
+      // #ifdef APP-PLUS-NVUE
+      height: 3
+      // #endif
+    }
+  },
+  props: {
+    containerStyle: {
+      type: String,
+      default: ''
+    },
+    content: {
+      type: String,
+      default: ''
+    },
+    copyLink: {
+      type: [Boolean, String],
+      default: true
+    },
+    domain: String,
+    errorImg: {
+      type: String,
+      default: ''
+    },
+    lazyLoad: {
+      type: [Boolean, String],
+      default: false
+    },
+    loadingImg: {
+      type: String,
+      default: ''
+    },
+    pauseVideo: {
+      type: [Boolean, String],
+      default: true
+    },
+    previewImg: {
+      type: [Boolean, String],
+      default: true
+    },
+    scrollTable: [Boolean, String],
+    selectable: [Boolean, String],
+    setTitle: {
+      type: [Boolean, String],
+      default: true
+    },
+    showImgMenu: {
+      type: [Boolean, String],
+      default: true
+    },
+    tagStyle: Object,
+    useAnchor: [Boolean, Number]
+  },
+  // #ifndef APP-PLUS-NVUE
+  components: {
+    node
+  },
+  // #endif
+  watch: {
+    content (content) {
+      this.setContent(content)
+    }
+  },
+  created () {
+    this.plugins = []
+    for (let i = plugins.length; i--;) {
+      this.plugins.push(new plugins[i](this))
+    }
+  },
+  mounted () {
+    if (this.content && !this.nodes.length) {
+      this.setContent(this.content)
+    }
+  },
+  beforeDestroy () {
+    this._hook('onDetached')
+    clearInterval(this._timer)
+  },
+  methods: {
+    /**
+     * @description 将锚点跳转的范围限定在一个 scroll-view 内
+     * @param {Object} page scroll-view 所在页面的示例
+     * @param {String} selector scroll-view 的选择器
+     * @param {String} scrollTop scroll-view scroll-top 属性绑定的变量名
+     */
+    in (page, selector, scrollTop) {
+      // #ifndef APP-PLUS-NVUE
+      if (page && selector && scrollTop) {
+        this._in = {
+          page,
+          selector,
+          scrollTop
+        }
+      }
+      // #endif
+    },
+
+    /**
+     * @description 锚点跳转
+     * @param {String} id 要跳转的锚点 id
+     * @param {Number} offset 跳转位置的偏移量
+     * @returns {Promise}
+     */
+    navigateTo (id, offset) {
+      return new Promise((resolve, reject) => {
+        if (!this.useAnchor) {
+          reject(Error('Anchor is disabled'))
+          return
+        }
+        offset = offset || parseInt(this.useAnchor) || 0
+        // #ifdef APP-PLUS-NVUE
+        if (!id) {
+          dom.scrollToElement(this.$refs.web, {
+            offset
+          })
+          resolve()
+        } else {
+          this._navigateTo = {
+            resolve,
+            reject,
+            offset
+          }
+          this.$refs.web.evalJs('uni.postMessage({data:{action:"getOffset",offset:(document.getElementById(' + id + ')||{}).offsetTop}})')
+        }
+        // #endif
+        // #ifndef APP-PLUS-NVUE
+        let deep = ' '
+        // #ifdef MP-WEIXIN || MP-QQ || MP-TOUTIAO
+        deep = '>>>'
+        // #endif
+        const selector = uni.createSelectorQuery()
+          // #ifndef MP-ALIPAY
+          .in(this._in ? this._in.page : this)
+          // #endif
+          .select((this._in ? this._in.selector : '._root') + (id ? `${deep}#${id}` : '')).boundingClientRect()
+        if (this._in) {
+          selector.select(this._in.selector).scrollOffset()
+            .select(this._in.selector).boundingClientRect()
+        } else {
+          // 获取 scroll-view 的位置和滚动距离
+          selector.selectViewport().scrollOffset() // 获取窗口的滚动距离
+        }
+        selector.exec(res => {
+          if (!res[0]) {
+            reject(Error('Label not found'))
+            return
+          }
+          const scrollTop = res[1].scrollTop + res[0].top - (res[2] ? res[2].top : 0) + offset
+          if (this._in) {
+            // scroll-view 跳转
+            this._in.page[this._in.scrollTop] = scrollTop
+          } else {
+            // 页面跳转
+            uni.pageScrollTo({
+              scrollTop,
+              duration: 300
+            })
+          }
+          resolve()
+        })
+        // #endif
+      })
+    },
+
+    /**
+     * @description 获取文本内容
+     * @return {String}
+     */
+    getText (nodes) {
+      let text = '';
+      (function traversal (nodes) {
+        for (let i = 0; i < nodes.length; i++) {
+          const node = nodes[i]
+          if (node.type === 'text') {
+            text += node.text.replace(/&amp;/g, '&')
+          } else if (node.name === 'br') {
+            text += '\n'
+          } else {
+            // 块级标签前后加换行
+            const isBlock = node.name === 'p' || node.name === 'div' || node.name === 'tr' || node.name === 'li' || (node.name[0] === 'h' && node.name[1] > '0' && node.name[1] < '7')
+            if (isBlock && text && text[text.length - 1] !== '\n') {
+              text += '\n'
+            }
+            // 递归获取子节点的文本
+            if (node.children) {
+              traversal(node.children)
+            }
+            if (isBlock && text[text.length - 1] !== '\n') {
+              text += '\n'
+            } else if (node.name === 'td' || node.name === 'th') {
+              text += '\t'
+            }
+          }
+        }
+      })(nodes || this.nodes)
+      return text
+    },
+
+    /**
+     * @description 获取内容大小和位置
+     * @return {Promise}
+     */
+    getRect () {
+      return new Promise((resolve, reject) => {
+        uni.createSelectorQuery()
+          // #ifndef MP-ALIPAY
+          .in(this)
+          // #endif
+          .select('#_root').boundingClientRect().exec(res => res[0] ? resolve(res[0]) : reject(Error('Root label not found')))
+      })
+    },
+
+    /**
+     * @description 设置内容
+     * @param {String} content html 内容
+     * @param {Boolean} append 是否在尾部追加
+     */
+    setContent (content, append) {
+      if (!append || !this.imgList) {
+        this.imgList = []
+      }
+      const nodes = new Parser(this).parse(content)
+      // #ifdef APP-PLUS-NVUE
+      if (this._ready) {
+        this._set(nodes, append)
+      }
+      // #endif
+      this.$set(this, 'nodes', append ? (this.nodes || []).concat(nodes) : nodes)
+
+      // #ifndef APP-PLUS-NVUE
+      this._videos = []
+      this.$nextTick(() => {
+        this._hook('onLoad')
+        this.$emit('load')
+      })
+
+      // 等待图片加载完毕
+      let height
+      clearInterval(this._timer)
+      this._timer = setInterval(() => {
+        this.getRect().then(rect => {
+          // 350ms 总高度无变化就触发 ready 事件
+          if (rect.height === height) {
+            this.$emit('ready', rect)
+            clearInterval(this._timer)
+          }
+          height = rect.height
+        }).catch(() => { })
+      }, 350)
+      // #endif
+    },
+
+    /**
+     * @description 调用插件钩子函数
+     */
+    _hook (name) {
+      for (let i = plugins.length; i--;) {
+        if (this.plugins[i][name]) {
+          this.plugins[i][name]()
+        }
+      }
+    },
+
+    // #ifdef APP-PLUS-NVUE
+    /**
+     * @description 设置内容
+     */
+    _set (nodes, append) {
+      this.$refs.web.evalJs('setContent(' + JSON.stringify(nodes) + ',' + JSON.stringify([this.containerStyle.replace(/(?:margin|padding)[^;]+/g, ''), this.errorImg, this.loadingImg, this.pauseVideo, this.scrollTable, this.selectable]) + ',' + append + ')')
+    },
+
+    /**
+     * @description 接收到 web-view 消息
+     */
+    _onMessage (e) {
+      const message = e.detail.data[0]
+      switch (message.action) {
+        // web-view 初始化完毕
+        case 'onJSBridgeReady':
+          this._ready = true
+          if (this.nodes) {
+            this._set(this.nodes)
+          }
+          break
+        // 内容 dom 加载完毕
+        case 'onLoad':
+          this.height = message.height
+          this._hook('onLoad')
+          this.$emit('load')
+          break
+        // 所有图片加载完毕
+        case 'onReady':
+          this.getRect().then(res => {
+            this.$emit('ready', res)
+          }).catch(() => { })
+          break
+        // 总高度发生变化
+        case 'onHeightChange':
+          this.height = message.height
+          break
+        // 图片点击
+        case 'onImgTap':
+          this.$emit('imgtap', message.attrs)
+          if (this.previewImg) {
+            uni.previewImage({
+              current: parseInt(message.attrs.i),
+              urls: this.imgList
+            })
+          }
+          break
+        // 链接点击
+        case 'onLinkTap': {
+          const href = message.attrs.href
+          this.$emit('linktap', message.attrs)
+          if (href) {
+            // 锚点跳转
+            if (href[0] === '#') {
+              if (this.useAnchor) {
+                dom.scrollToElement(this.$refs.web, {
+                  offset: message.offset
+                })
+              }
+            } else if (href.includes('://')) {
+              // 打开外链
+              if (this.copyLink) {
+                plus.runtime.openWeb(href)
+              }
+            } else {
+              uni.navigateTo({
+                url: href,
+                fail () {
+                  uni.switchTab({
+                    url: href
+                  })
+                }
+              })
+            }
+          }
+          break
+        }
+        // 获取到锚点的偏移量
+        case 'getOffset':
+          if (typeof message.offset === 'number') {
+            dom.scrollToElement(this.$refs.web, {
+              offset: message.offset + this._navigateTo.offset
+            })
+            this._navigateTo.resolve()
+          } else {
+            this._navigateTo.reject(Error('Label not found'))
+          }
+          break
+        // 点击
+        case 'onClick':
+          this.$emit('tap')
+          this.$emit('click')
+          break
+        // 出错
+        case 'onError':
+          this.$emit('error', {
+            source: message.source,
+            attrs: message.attrs
+          })
+      }
+    }
+    // #endif
+  }
+}
+</script>
+
+<style>
+/* #ifndef APP-PLUS-NVUE */
+/* 根节点样式 */
+._root {
+  padding: 1px 0;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-overflow-scrolling: touch;
+}
+
+/* 长按复制 */
+._select {
+  user-select: text;
+}
+/* #endif */
+</style>

uni_modules/mp-html/components/mp-html/node/node.vue

@@ -0,0 +1,524 @@
+<template>
+  <view :id="attrs.id" :class="'_block _'+name+' '+attrs.class" :style="attrs.style">
+    <block v-for="(n, i) in childs" v-bind:key="i">
+      <!-- 图片 -->
+      <!-- 占位图 -->
+      <image v-if="n.name==='img'&&((opts[1]&&!ctrl[i])||ctrl[i]<0)" class="_img" :style="n.attrs.style" :src="ctrl[i]<0?opts[2]:opts[1]" mode="widthFix" />
+      <!-- 显示图片 -->
+      <!-- #ifdef H5 || APP-PLUS -->
+      <img v-if="n.name==='img'" :id="n.attrs.id" :class="'_img '+n.attrs.class" :style="(ctrl[i]===-1?'display:none;':'')+n.attrs.style" :src="n.attrs.src||(ctrl.load?n.attrs['data-src']:'')" :data-i="i" @load="imgLoad" @error="mediaError" @tap.stop="imgTap" @longpress="imgLongTap"/>
+      <!-- #endif -->
+      <!-- #ifndef H5 || APP-PLUS -->
+      <image v-if="n.name==='img'" :id="n.attrs.id" :class="'_img '+n.attrs.class" :style="(ctrl[i]===-1?'display:none;':'')+'width:'+(ctrl[i]||1)+'px;height:1px;'+n.attrs.style" :src="n.attrs.src" :mode="n.h?'':'widthFix'" :lazy-load="opts[0]" :webp="n.webp" :show-menu-by-longpress="opts[3]&&!n.attrs.ignore" :image-menu-prevent="!opts[3]||n.attrs.ignore" :data-i="i" @load="imgLoad" @error="mediaError" @tap.stop="imgTap" @longpress="imgLongTap" />
+      <!-- #endif -->
+      <!-- 文本 -->
+      <!-- #ifndef MP-BAIDU || MP-ALIPAY || MP-TOUTIAO -->
+      <text v-else-if="n.text" :user-select="n.us" decode>{{n.text}}</text>
+      <!-- #endif -->
+      <text v-else-if="n.name==='br'">\n</text>
+      <!-- 链接 -->
+      <view v-else-if="n.name==='a'" :id="n.attrs.id" :class="(n.attrs.href?'_a ':'')+n.attrs.class" hover-class="_hover" :style="'display:inline;'+n.attrs.style" :data-i="i" @tap.stop="linkTap">
+        <node name="span" :childs="n.children" :opts="opts" style="display:inherit" />
+      </view>
+      <!-- 视频 -->
+      <!-- #ifdef APP-PLUS -->
+      <view v-else-if="n.html" :id="n.attrs.id" :class="'_video '+n.attrs.class" :style="n.attrs.style" v-html="n.html" />
+      <!-- #endif -->
+      <!-- #ifndef APP-PLUS -->
+      <video v-else-if="n.name==='video'" :id="n.attrs.id" :class="n.attrs.class" :style="n.attrs.style" :autoplay="n.attrs.autoplay" :controls="n.attrs.controls" :loop="n.attrs.loop" :muted="n.attrs.muted" :poster="n.attrs.poster" :src="n.src[ctrl[i]||0]" :data-i="i" @play="play" @error="mediaError" />
+      <!-- #endif -->
+      <!-- #ifdef H5 || APP-PLUS -->
+      <iframe v-else-if="n.name==='iframe'" :style="n.attrs.style" :allowfullscreen="n.attrs.allowfullscreen" :frameborder="n.attrs.frameborder" :src="n.attrs.src" />
+      <embed v-else-if="n.name==='embed'" :style="n.attrs.style" :src="n.attrs.src" />
+      <!-- #endif -->
+      <!-- #ifndef MP-TOUTIAO -->
+      <!-- 音频 -->
+      <audio v-else-if="n.name==='audio'" :id="n.attrs.id" :class="n.attrs.class" :style="n.attrs.style" :author="n.attrs.author" :controls="n.attrs.controls" :loop="n.attrs.loop" :name="n.attrs.name" :poster="n.attrs.poster" :src="n.src[ctrl[i]||0]" :data-i="i" @play="play" @error="mediaError" />
+      <!-- #endif -->
+      <view v-else-if="(n.name==='table'&&n.c)||n.name==='li'" :id="n.attrs.id" :class="'_'+n.name+' '+n.attrs.class" :style="n.attrs.style">
+        <node v-if="n.name==='li'" :childs="n.children" :opts="opts" />
+        <view v-else v-for="(tbody, x) in n.children" v-bind:key="x" :class="'_'+tbody.name+' '+tbody.attrs.class" :style="tbody.attrs.style">
+          <node v-if="tbody.name==='td'||tbody.name==='th'" :childs="tbody.children" :opts="opts" />
+          <block v-else v-for="(tr, y) in tbody.children" v-bind:key="y">
+            <view v-if="tr.name==='td'||tr.name==='th'" :class="'_'+tr.name+' '+tr.attrs.class" :style="tr.attrs.style">
+              <node :childs="tr.children" :opts="opts" />
+            </view>
+            <view v-else :class="'_'+tr.name+' '+tr.attrs.class" :style="tr.attrs.style">
+              <view v-for="(td, z) in tr.children" v-bind:key="z" :class="'_'+td.name+' '+td.attrs.class" :style="td.attrs.style">
+                <node :childs="td.children" :opts="opts" />
+              </view>
+            </view>
+          </block>
+        </view>
+      </view>
+      
+      <!-- 富文本 -->
+      <!-- #ifdef H5 || MP-WEIXIN || MP-QQ || APP-PLUS || MP-360 -->
+      <rich-text v-else-if="handler.use(n)" :id="n.attrs.id" :style="n.f" :nodes="[n]" />
+      <!-- #endif -->
+      <!-- #ifndef H5 || MP-WEIXIN || MP-QQ || APP-PLUS || MP-360 -->
+      <rich-text v-else-if="!n.c" :id="n.attrs.id" :style="n.f+';display:inline'" :preview="false" :nodes="[n]" />
+      <!-- #endif -->
+      <!-- 继续递归 -->
+      <view v-else-if="n.c===2" :id="n.attrs.id" :class="'_block _'+n.name+' '+n.attrs.class" :style="n.f+';'+n.attrs.style">
+        <node v-for="(n2, j) in n.children" v-bind:key="j" :style="n2.f" :name="n2.name" :attrs="n2.attrs" :childs="n2.children" :opts="opts" />
+      </view>
+      <node v-else :style="n.f" :name="n.name" :attrs="n.attrs" :childs="n.children" :opts="opts" />
+    </block>
+  </view>
+</template>
+<script module="handler" lang="wxs">
+// 行内标签列表
+var inlineTags = {
+  abbr: true,
+  b: true,
+  big: true,
+  code: true,
+  del: true,
+  em: true,
+  i: true,
+  ins: true,
+  label: true,
+  q: true,
+  small: true,
+  span: true,
+  strong: true,
+  sub: true,
+  sup: true
+}
+/**
+ * @description 是否使用 rich-text 显示剩余内容
+ */
+module.exports = {
+  use: function (item) {
+    if (item.c) return false
+    // 微信和 QQ 的 rich-text inline 布局无效
+    return !inlineTags[item.name] && (item.attrs.style || '').indexOf('display:inline') == -1
+  }
+}
+</script>
+<script>
+
+import node from './node'
+export default {
+  name: 'node',
+  options: {
+    // #ifdef MP-WEIXIN
+    virtualHost: true,
+    // #endif
+    // #ifdef MP-TOUTIAO
+    addGlobalClass: false
+    // #endif
+  },
+  data () {
+    return {
+      ctrl: {}
+    }
+  },
+  props: {
+    name: String,
+    attrs: {
+      type: Object,
+      default () {
+        return {}
+      }
+    },
+    childs: Array,
+    opts: Array
+  },
+  components: {
+
+    node
+  },
+  mounted () {
+    this.$nextTick(() => {
+      for (this.root = this.$parent; this.root.$options.name !== 'mp-html'; this.root = this.root.$parent);
+    })
+    // #ifdef H5 || APP-PLUS
+    if (this.opts[0]) {
+      let i
+      for (i = this.childs.length; i--;) {
+        if (this.childs[i].name === 'img') break
+      }
+      if (i !== -1) {
+        this.observer = uni.createIntersectionObserver(this).relativeToViewport({
+          top: 500,
+          bottom: 500
+        })
+        this.observer.observe('._img', res => {
+          if (res.intersectionRatio) {
+            this.$set(this.ctrl, 'load', 1)
+            this.observer.disconnect()
+          }
+        })
+      }
+    }
+    // #endif
+  },
+  beforeDestroy () {
+    // #ifdef H5 || APP-PLUS
+    if (this.observer) {
+      this.observer.disconnect()
+    }
+    // #endif
+  },
+  methods:{
+    // #ifdef MP-WEIXIN
+    toJSON () { },
+    // #endif
+    /**
+     * @description 播放视频事件
+     * @param {Event} e
+     */
+    play (e) {
+      // #ifndef APP-PLUS
+      if (this.root.pauseVideo) {
+        let flag = false; const id = e.target.id
+        for (let i = this.root._videos.length; i--;) {
+          if (this.root._videos[i].id === id) {
+            flag = true
+          } else {
+            this.root._videos[i].pause() // 自动暂停其他视频
+          }
+        }
+        // 将自己加入列表
+        if (!flag) {
+          const ctx = uni.createVideoContext(id
+            // #ifndef MP-BAIDU
+            , this
+            // #endif
+          )
+          ctx.id = id
+          this.root._videos.push(ctx)
+        }
+      }
+      // #endif
+    },
+
+    /**
+     * @description 图片点击事件
+     * @param {Event} e
+     */
+    imgTap (e) {
+      const node = this.childs[e.currentTarget.dataset.i]
+      if (node.a) {
+        this.linkTap(node.a)
+        return
+      }
+      if (node.attrs.ignore) return
+      // #ifdef H5 || APP-PLUS
+      node.attrs.src = node.attrs.src || node.attrs['data-src']
+      // #endif
+      this.root.$emit('imgtap', node.attrs)
+      // 自动预览图片
+      if (this.root.previewImg) {
+        uni.previewImage({
+          current: parseInt(node.attrs.i),
+          urls: this.root.imgList
+        })
+      }
+    },
+
+    /**
+     * @description 图片长按
+     */
+    imgLongTap (e) {
+      // #ifdef APP-PLUS
+      const attrs = this.childs[e.currentTarget.dataset.i].attrs
+      if (this.opts[3] && !attrs.ignore) {
+        uni.showActionSheet({
+          itemList: ['保存图片'],
+          success: () => {
+            const save = path => {
+              uni.saveImageToPhotosAlbum({
+                filePath: path,
+                success () {
+                  uni.showToast({
+                    title: '保存成功'
+                  })
+                }
+              })
+            }
+            if (this.root.imgList[attrs.i].startsWith('http')) {
+              uni.downloadFile({
+                url: this.root.imgList[attrs.i],
+                success: res => save(res.tempFilePath)
+              })
+            } else {
+              save(this.root.imgList[attrs.i])
+            }
+          }
+        })
+      }
+      // #endif
+    },
+
+    /**
+     * @description 图片加载完成事件
+     * @param {Event} e
+     */
+    imgLoad (e) {
+      const i = e.currentTarget.dataset.i
+      /* #ifndef H5 || APP-PLUS */
+      if (!this.childs[i].w) {
+        // 设置原宽度
+        this.$set(this.ctrl, i, e.detail.width)
+      } else /* #endif */ if ((this.opts[1] && !this.ctrl[i]) || this.ctrl[i] === -1) {
+        // 加载完毕，取消加载中占位图
+        this.$set(this.ctrl, i, 1)
+      }
+    },
+
+    /**
+     * @description 链接点击事件
+     * @param {Event} e
+     */
+    linkTap (e) {
+      const node = e.currentTarget ? this.childs[e.currentTarget.dataset.i] : {}
+      const attrs = node.attrs || e
+      const href = attrs.href
+      this.root.$emit('linktap', Object.assign({
+        innerText: this.root.getText(node.children || []) // 链接内的文本内容
+      }, attrs))
+      if (href) {
+        if (href[0] === '#') {
+          // 跳转锚点
+          this.root.navigateTo(href.substring(1)).catch(() => { })
+        } else if (href.split('?')[0].includes('://')) {
+          // 复制外部链接
+          if (this.root.copyLink) {
+            // #ifdef H5
+            window.open(href)
+            // #endif
+            // #ifdef MP
+            uni.setClipboardData({
+              data: href,
+              success: () =>
+                uni.showToast({
+                  title: '链接已复制'
+                })
+            })
+            // #endif
+            // #ifdef APP-PLUS
+            plus.runtime.openWeb(href)
+            // #endif
+          }
+        } else {
+          // 跳转页面
+          uni.navigateTo({
+            url: href,
+            fail () {
+              uni.switchTab({
+                url: href,
+                fail () { }
+              })
+            }
+          })
+        }
+      }
+    },
+
+    /**
+     * @description 错误事件
+     * @param {Event} e
+     */
+    mediaError (e) {
+      const i = e.currentTarget.dataset.i
+      const node = this.childs[i]
+      // 加载其他源
+      if (node.name === 'video' || node.name === 'audio') {
+        let index = (this.ctrl[i] || 0) + 1
+        if (index > node.src.length) {
+          index = 0
+        }
+        if (index < node.src.length) {
+          this.$set(this.ctrl, i, index)
+          return
+        }
+      } else if (node.name === 'img' && this.opts[2]) {
+        // 显示错误占位图
+        this.$set(this.ctrl, i, -1)
+      }
+      if (this.root) {
+        this.root.$emit('error', {
+          source: node.name,
+          attrs: node.attrs,
+          errMsg: e.detail.errMsg
+        })
+      }
+    }
+  }
+}
+</script>
+<style>
+/* a 标签默认效果 */
+._a {
+  padding: 1.5px 0 1.5px 0;
+  color: #366092;
+  word-break: break-all;
+}
+
+/* a 标签点击态效果 */
+._hover {
+  text-decoration: underline;
+  opacity: 0.7;
+}
+
+/* 图片默认效果 */
+._img {
+  max-width: 100%;
+  -webkit-touch-callout: none;
+}
+
+/* 内部样式 */
+
+._block {
+  display: block;
+}
+
+._b,
+._strong {
+  font-weight: bold;
+}
+
+._code {
+  font-family: monospace;
+}
+
+._del {
+  text-decoration: line-through;
+}
+
+._em,
+._i {
+  font-style: italic;
+}
+
+._h1 {
+  font-size: 2em;
+}
+
+._h2 {
+  font-size: 1.5em;
+}
+
+._h3 {
+  font-size: 1.17em;
+}
+
+._h5 {
+  font-size: 0.83em;
+}
+
+._h6 {
+  font-size: 0.67em;
+}
+
+._h1,
+._h2,
+._h3,
+._h4,
+._h5,
+._h6 {
+  display: block;
+  font-weight: bold;
+}
+
+._image {
+  height: 1px;
+}
+
+._ins {
+  text-decoration: underline;
+}
+
+._li {
+  display: list-item;
+}
+
+._ol {
+  list-style-type: decimal;
+}
+
+._ol,
+._ul {
+  display: block;
+  padding-left: 40px;
+  margin: 1em 0;
+}
+
+._q::before {
+  content: '"';
+}
+
+._q::after {
+  content: '"';
+}
+
+._sub {
+  font-size: smaller;
+  vertical-align: sub;
+}
+
+._sup {
+  font-size: smaller;
+  vertical-align: super;
+}
+
+._thead,
+._tbody,
+._tfoot {
+  display: table-row-group;
+}
+
+._tr {
+  display: table-row;
+}
+
+._td,
+._th {
+  display: table-cell;
+  vertical-align: middle;
+}
+
+._th {
+  font-weight: bold;
+  text-align: center;
+}
+
+._ul {
+  list-style-type: disc;
+}
+
+._ul ._ul {
+  margin: 0;
+  list-style-type: circle;
+}
+
+._ul ._ul ._ul {
+  list-style-type: square;
+}
+
+._abbr,
+._b,
+._code,
+._del,
+._em,
+._i,
+._ins,
+._label,
+._q,
+._span,
+._strong,
+._sub,
+._sup {
+  display: inline;
+}
+
+/* #ifdef APP-PLUS */
+._video {
+  width: 300px;
+  height: 225px;
+}
+/* #endif */
+</style>

uni_modules/mp-html/components/mp-html/parser.js

@@ -0,0 +1,1223 @@
+/**
+ * @fileoverview html 解析器
+ */
+
+// 配置
+const config = {
+  // 信任的标签（保持标签名不变）
+  trustTags: makeMap('a,abbr,ad,audio,b,blockquote,br,code,col,colgroup,dd,del,dl,dt,div,em,fieldset,h1,h2,h3,h4,h5,h6,hr,i,img,ins,label,legend,li,ol,p,q,ruby,rt,source,span,strong,sub,sup,table,tbody,td,tfoot,th,thead,tr,title,ul,video'),
+
+  // 块级标签（转为 div，其他的非信任标签转为 span）
+  blockTags: makeMap('address,article,aside,body,caption,center,cite,footer,header,html,nav,pre,section'),
+
+  // 要移除的标签
+  ignoreTags: makeMap('area,base,canvas,embed,frame,head,iframe,input,link,map,meta,param,rp,script,source,style,textarea,title,track,wbr'),
+
+  // 自闭合的标签
+  voidTags: makeMap('area,base,br,col,circle,ellipse,embed,frame,hr,img,input,line,link,meta,param,path,polygon,rect,source,track,use,wbr'),
+
+  // html 实体
+  entities: {
+    lt: '<',
+    gt: '>',
+    quot: '"',
+    apos: "'",
+    ensp: '\u2002',
+    emsp: '\u2003',
+    nbsp: '\xA0',
+    semi: ';',
+    ndash: '–',
+    mdash: '—',
+    middot: '·',
+    lsquo: '‘',
+    rsquo: '’',
+    ldquo: '“',
+    rdquo: '”',
+    bull: '•',
+    hellip: '…'
+  },
+
+  // 默认的标签样式
+  tagStyle: {
+    // #ifndef APP-PLUS-NVUE
+    address: 'font-style:italic',
+    big: 'display:inline;font-size:1.2em',
+    caption: 'display:table-caption;text-align:center',
+    center: 'text-align:center',
+    cite: 'font-style:italic',
+    dd: 'margin-left:40px',
+    mark: 'background-color:yellow',
+    pre: 'font-family:monospace;white-space:pre',
+    s: 'text-decoration:line-through',
+    small: 'display:inline;font-size:0.8em',
+    strike: 'text-decoration:line-through',
+    u: 'text-decoration:underline'
+    // #endif
+  },
+
+  // svg 大小写对照表
+  svgDict: {
+    animatetransform: 'animateTransform',
+    lineargradient: 'linearGradient',
+    viewbox: 'viewBox',
+    attributename: 'attributeName',
+    repeatcount: 'repeatCount',
+    repeatdur: 'repeatDur'
+  }
+}
+const tagSelector={}
+const {
+  windowWidth,
+  // #ifdef MP-WEIXIN
+  system
+  // #endif
+} = uni.getSystemInfoSync()
+const blankChar = makeMap(' ,\r,\n,\t,\f')
+let idIndex = 0
+
+// #ifdef H5 || APP-PLUS
+config.ignoreTags.iframe = undefined
+config.trustTags.iframe = true
+config.ignoreTags.embed = undefined
+config.trustTags.embed = true
+// #endif
+// #ifdef APP-PLUS-NVUE
+config.ignoreTags.source = undefined
+config.ignoreTags.style = undefined
+// #endif
+
+/**
+ * @description 创建 map
+ * @param {String} str 逗号分隔
+ */
+function makeMap (str) {
+  const map = Object.create(null)
+  const list = str.split(',')
+  for (let i = list.length; i--;) {
+    map[list[i]] = true
+  }
+  return map
+}
+
+/**
+ * @description 解码 html 实体
+ * @param {String} str 要解码的字符串
+ * @param {Boolean} amp 要不要解码 &amp;
+ * @returns {String} 解码后的字符串
+ */
+function decodeEntity (str, amp) {
+  let i = str.indexOf('&')
+  while (i !== -1) {
+    const j = str.indexOf(';', i + 3)
+    let code
+    if (j === -1) break
+    if (str[i + 1] === '#') {
+      // &#123; 形式的实体
+      code = parseInt((str[i + 2] === 'x' ? '0' : '') + str.substring(i + 2, j))
+      if (!isNaN(code)) {
+        str = str.substr(0, i) + String.fromCharCode(code) + str.substr(j + 1)
+      }
+    } else {
+      // &nbsp; 形式的实体
+      code = str.substring(i + 1, j)
+      if (config.entities[code] || (code === 'amp' && amp)) {
+        str = str.substr(0, i) + (config.entities[code] || '&') + str.substr(j + 1)
+      }
+    }
+    i = str.indexOf('&', i + 1)
+  }
+  return str
+}
+
+/**
+ * @description html 解析器
+ * @param {Object} vm 组件实例
+ */
+function Parser (vm) {
+  this.options = vm || {}
+  this.tagStyle = Object.assign({}, config.tagStyle, this.options.tagStyle)
+  this.imgList = vm.imgList || []
+  this.plugins = vm.plugins || []
+  this.attrs = Object.create(null)
+  this.stack = []
+  this.nodes = []
+  this.pre = (this.options.containerStyle || '').includes('white-space') && this.options.containerStyle.includes('pre') ? 2 : 0
+}
+
+/**
+ * @description 执行解析
+ * @param {String} content 要解析的文本
+ */
+Parser.prototype.parse = function (content) {
+  // 插件处理
+  for (let i = this.plugins.length; i--;) {
+    if (this.plugins[i].onUpdate) {
+      content = this.plugins[i].onUpdate(content, config) || content
+    }
+  }
+
+  new Lexer(this).parse(content)
+  // 出栈未闭合的标签
+  while (this.stack.length) {
+    this.popNode()
+  }
+  return this.nodes
+}
+
+/**
+ * @description 将标签暴露出来（不被 rich-text 包含）
+ */
+Parser.prototype.expose = function () {
+  // #ifndef APP-PLUS-NVUE
+  for (let i = this.stack.length; i--;) {
+    const item = this.stack[i]
+    if (item.c || item.name === 'a' || item.name === 'video' || item.name === 'audio') return
+    item.c = 1
+  }
+  // #endif
+}
+
+/**
+ * @description 处理插件
+ * @param {Object} node 要处理的标签
+ * @returns {Boolean} 是否要移除此标签
+ */
+Parser.prototype.hook = function (node) {
+  for (let i = this.plugins.length; i--;) {
+    if (this.plugins[i].onParse && this.plugins[i].onParse(node, this) === false) {
+      return false
+    }
+  }
+  return true
+}
+
+/**
+ * @description 将链接拼接上主域名
+ * @param {String} url 需要拼接的链接
+ * @returns {String} 拼接后的链接
+ */
+Parser.prototype.getUrl = function (url) {
+  const domain = this.options.domain
+  if (url[0] === '/') {
+    if (url[1] === '/') {
+      // // 开头的补充协议名
+      url = (domain ? domain.split('://')[0] : 'http') + ':' + url
+    } else if (domain) {
+      // 否则补充整个域名
+      url = domain + url
+    }
+  } else if (domain && !url.includes('data:') && !url.includes('://')) {
+    url = domain + '/' + url
+  }
+  return url
+}
+
+/**
+ * @description 解析样式表
+ * @param {Object} node 标签
+ * @returns {Object}
+ */
+Parser.prototype.parseStyle = function (node) {
+  const attrs = node.attrs
+  const list = (this.tagStyle[node.name] || '').split(';').concat((attrs.style || '').split(';'))
+  const styleObj = {}
+  let tmp = ''
+
+  if (attrs.id && !this.xml) {
+    // 暴露锚点
+    if (this.options.useAnchor) {
+      this.expose()
+    } else if (node.name !== 'img' && node.name !== 'a' && node.name !== 'video' && node.name !== 'audio') {
+      attrs.id = undefined
+    }
+  }
+
+  // 转换 width 和 height 属性
+  if (attrs.width) {
+    styleObj.width = parseFloat(attrs.width) + (attrs.width.includes('%') ? '%' : 'px')
+    attrs.width = undefined
+  }
+  if (attrs.height) {
+    styleObj.height = parseFloat(attrs.height) + (attrs.height.includes('%') ? '%' : 'px')
+    attrs.height = undefined
+  }
+
+  for (let i = 0, len = list.length; i < len; i++) {
+    const info = list[i].split(':')
+    if (info.length < 2) continue
+    const key = info.shift().trim().toLowerCase()
+    let value = info.join(':').trim()
+    if ((value[0] === '-' && value.lastIndexOf('-') > 0) || value.includes('safe')) {
+      // 兼容性的 css 不压缩
+      tmp += `;${key}:${value}`
+    } else if (!styleObj[key] || value.includes('import') || !styleObj[key].includes('import')) {
+      // 重复的样式进行覆盖
+      if (value.includes('url')) {
+        // 填充链接
+        let j = value.indexOf('(') + 1
+        if (j) {
+          while (value[j] === '"' || value[j] === "'" || blankChar[value[j]]) {
+            j++
+          }
+          value = value.substr(0, j) + this.getUrl(value.substr(j))
+        }
+      } else if (value.includes('rpx')) {
+        // 转换 rpx（rich-text 内部不支持 rpx）
+        value = value.replace(/[0-9.]+\s*rpx/g, $ => parseFloat($) * windowWidth / 750 + 'px')
+      }
+      styleObj[key] = value
+    }
+  }
+
+  node.attrs.style = tmp
+  return styleObj
+}
+
+/**
+ * @description 解析到标签名
+ * @param {String} name 标签名
+ * @private
+ */
+Parser.prototype.onTagName = function (name) {
+  this.tagName = this.xml ? name : name.toLowerCase()
+  if (this.tagName === 'svg') {
+    this.xml = (this.xml || 0) + 1 // svg 标签内大小写敏感
+  }
+}
+
+/**
+ * @description 解析到属性名
+ * @param {String} name 属性名
+ * @private
+ */
+Parser.prototype.onAttrName = function (name) {
+  name = this.xml ? name : name.toLowerCase()
+  if (name.substr(0, 5) === 'data-') {
+    if (name === 'data-src' && !this.attrs.src) {
+      // data-src 自动转为 src
+      this.attrName = 'src'
+    } else if (this.tagName === 'img' || this.tagName === 'a') {
+      // a 和 img 标签保留 data- 的属性，可以在 imgtap 和 linktap 事件中使用
+      this.attrName = name
+    } else {
+      // 剩余的移除以减小大小
+      this.attrName = undefined
+    }
+  } else {
+    this.attrName = name
+    this.attrs[name] = 'T' // boolean 型属性缺省设置
+  }
+}
+
+/**
+ * @description 解析到属性值
+ * @param {String} val 属性值
+ * @private
+ */
+Parser.prototype.onAttrVal = function (val) {
+  const name = this.attrName || ''
+  if (name === 'style' || name === 'href') {
+    // 部分属性进行实体解码
+    this.attrs[name] = decodeEntity(val, true)
+  } else if (name.includes('src')) {
+    // 拼接主域名
+    this.attrs[name] = this.getUrl(decodeEntity(val, true))
+  } else if (name) {
+    this.attrs[name] = val
+  }
+}
+
+/**
+ * @description 解析到标签开始
+ * @param {Boolean} selfClose 是否有自闭合标识 />
+ * @private
+ */
+Parser.prototype.onOpenTag = function (selfClose) {
+  // 拼装 node
+  const node = Object.create(null)
+  node.name = this.tagName
+  node.attrs = this.attrs
+  // 避免因为自动 diff 使得 type 被设置为 null 导致部分内容不显示
+  if (this.options.nodes.length) {
+    node.type = 'node'
+  }
+  this.attrs = Object.create(null)
+
+  const attrs = node.attrs
+  const parent = this.stack[this.stack.length - 1]
+  const siblings = parent ? parent.children : this.nodes
+  const close = this.xml ? selfClose : config.voidTags[node.name]
+
+  // 替换标签名选择器
+  if (tagSelector[node.name]) {
+    attrs.class = tagSelector[node.name] + (attrs.class ? ' ' + attrs.class : '')
+  }
+
+  // 转换 embed 标签
+  if (node.name === 'embed') {
+    // #ifndef H5 || APP-PLUS
+    const src = attrs.src || ''
+    // 按照后缀名和 type 将 embed 转为 video 或 audio
+    if (src.includes('.mp4') || src.includes('.3gp') || src.includes('.m3u8') || (attrs.type || '').includes('video')) {
+      node.name = 'video'
+    } else if (src.includes('.mp3') || src.includes('.wav') || src.includes('.aac') || src.includes('.m4a') || (attrs.type || '').includes('audio')) {
+      node.name = 'audio'
+    }
+    if (attrs.autostart) {
+      attrs.autoplay = 'T'
+    }
+    attrs.controls = 'T'
+    // #endif
+    // #ifdef H5 || APP-PLUS
+    this.expose()
+    // #endif
+  }
+
+  // #ifndef APP-PLUS-NVUE
+  // 处理音视频
+  if (node.name === 'video' || node.name === 'audio') {
+    // 设置 id 以便获取 context
+    if (node.name === 'video' && !attrs.id) {
+      attrs.id = 'v' + idIndex++
+    }
+    // 没有设置 controls 也没有设置 autoplay 的自动设置 controls
+    if (!attrs.controls && !attrs.autoplay) {
+      attrs.controls = 'T'
+    }
+    // 用数组存储所有可用的 source
+    node.src = []
+    if (attrs.src) {
+      node.src.push(attrs.src)
+      attrs.src = undefined
+    }
+    this.expose()
+  }
+  // #endif
+
+  // 处理自闭合标签
+  if (close) {
+    if (!this.hook(node) || config.ignoreTags[node.name]) {
+      // 通过 base 标签设置主域名
+      if (node.name === 'base' && !this.options.domain) {
+        this.options.domain = attrs.href
+      } /* #ifndef APP-PLUS-NVUE */ else if (node.name === 'source' && parent && (parent.name === 'video' || parent.name === 'audio') && attrs.src) {
+        // 设置 source 标签（仅父节点为 video 或 audio 时有效）
+        parent.src.push(attrs.src)
+      } /* #endif */
+      return
+    }
+
+    // 解析 style
+    const styleObj = this.parseStyle(node)
+
+    // 处理图片
+    if (node.name === 'img') {
+      if (attrs.src) {
+        // 标记 webp
+        if (attrs.src.includes('webp')) {
+          node.webp = 'T'
+        }
+        // data url 图片如果没有设置 original-src 默认为不可预览的小图片
+        if (attrs.src.includes('data:') && !attrs['original-src']) {
+          attrs.ignore = 'T'
+        }
+        if (!attrs.ignore || node.webp || attrs.src.includes('cloud://')) {
+          for (let i = this.stack.length; i--;) {
+            const item = this.stack[i]
+            if (item.name === 'a') {
+              node.a = item.attrs
+              break
+            }
+            // #ifndef H5 || APP-PLUS
+            const style = item.attrs.style || ''
+            if (style.includes('flex:') && !style.includes('flex:0') && !style.includes('flex: 0') && (!styleObj.width || !styleObj.width.includes('%'))) {
+              styleObj.width = '100% !important'
+              styleObj.height = ''
+              for (let j = i + 1; j < this.stack.length; j++) {
+                this.stack[j].attrs.style = (this.stack[j].attrs.style || '').replace('inline-', '')
+              }
+            } else if (style.includes('flex') && styleObj.width === '100%') {
+              for (let j = i + 1; j < this.stack.length; j++) {
+                const style = this.stack[j].attrs.style || ''
+                if (!style.includes(';width') && !style.includes(' width') && style.indexOf('width') !== 0) {
+                  styleObj.width = ''
+                  break
+                }
+              }
+            } else if (style.includes('inline-block')) {
+              if (styleObj.width && styleObj.width[styleObj.width.length - 1] === '%') {
+                item.attrs.style += ';max-width:' + styleObj.width
+                styleObj.width = ''
+              } else {
+                item.attrs.style += ';max-width:100%'
+              }
+            }
+            // #endif
+            item.c = 1
+          }
+          attrs.i = this.imgList.length.toString()
+          let src = attrs['original-src'] || attrs.src
+          // #ifndef H5 || MP-ALIPAY || APP-PLUS || MP-360
+          if (this.imgList.includes(src)) {
+            // 如果有重复的链接则对域名进行随机大小写变换避免预览时错位
+            let i = src.indexOf('://')
+            if (i !== -1) {
+              i += 3
+              let newSrc = src.substr(0, i)
+              for (; i < src.length; i++) {
+                if (src[i] === '/') break
+                newSrc += Math.random() > 0.5 ? src[i].toUpperCase() : src[i]
+              }
+              newSrc += src.substr(i)
+              src = newSrc
+            }
+          }
+          // #endif
+          this.imgList.push(src)
+          // #ifdef H5 || APP-PLUS
+          if (this.options.lazyLoad) {
+            attrs['data-src'] = attrs.src
+            attrs.src = undefined
+          }
+          // #endif
+        }
+      }
+      if (styleObj.display === 'inline') {
+        styleObj.display = ''
+      }
+      // #ifndef APP-PLUS-NVUE
+      if (attrs.ignore) {
+        styleObj['max-width'] = styleObj['max-width'] || '100%'
+        attrs.style += ';-webkit-touch-callout:none'
+      }
+      // #endif
+      // 设置的宽度超出屏幕，为避免变形，高度转为自动
+      if (parseInt(styleObj.width) > windowWidth) {
+        styleObj.height = undefined
+      }
+      // 记录是否设置了宽高
+      if (styleObj.width) {
+        if (styleObj.width.includes('auto')) {
+          styleObj.width = ''
+        } else {
+          node.w = 'T'
+          if (!isNaN(parseInt(styleObj.height))) {
+            node.h = 'T'
+          }
+        }
+      }
+    } else if (node.name === 'svg') {
+      siblings.push(node)
+      this.stack.push(node)
+      this.popNode()
+      return
+    }
+    for (const key in styleObj) {
+      if (styleObj[key]) {
+        attrs.style += `;${key}:${styleObj[key].replace(' !important', '')}`
+      }
+    }
+    attrs.style = attrs.style.substr(1) || undefined
+  } else {
+    if ((node.name === 'pre' || ((attrs.style || '').includes('white-space') && attrs.style.includes('pre'))) && this.pre !== 2) {
+      this.pre = node.pre = 1
+    }
+    node.children = []
+    this.stack.push(node)
+  }
+
+  // 加入节点树
+  siblings.push(node)
+}
+
+/**
+ * @description 解析到标签结束
+ * @param {String} name 标签名
+ * @private
+ */
+Parser.prototype.onCloseTag = function (name) {
+  // 依次出栈到匹配为止
+  name = this.xml ? name : name.toLowerCase()
+  let i
+  for (i = this.stack.length; i--;) {
+    if (this.stack[i].name === name) break
+  }
+  if (i !== -1) {
+    while (this.stack.length > i) {
+      this.popNode()
+    }
+  } else if (name === 'p' || name === 'br') {
+    const siblings = this.stack.length ? this.stack[this.stack.length - 1].children : this.nodes
+    siblings.push({
+      name,
+      attrs: {
+        class: tagSelector[name],
+        style: this.tagStyle[name]
+      }
+    })
+  }
+}
+
+/**
+ * @description 处理标签出栈
+ * @private
+ */
+Parser.prototype.popNode = function () {
+  const node = this.stack.pop()
+  let attrs = node.attrs
+  const children = node.children
+  const parent = this.stack[this.stack.length - 1]
+  const siblings = parent ? parent.children : this.nodes
+
+  if (!this.hook(node) || config.ignoreTags[node.name]) {
+    // 获取标题
+    if (node.name === 'title' && children.length && children[0].type === 'text' && this.options.setTitle) {
+      uni.setNavigationBarTitle({
+        title: children[0].text
+      })
+    }
+    siblings.pop()
+    return
+  }
+
+  if (node.pre && this.pre !== 2) {
+    // 是否合并空白符标识
+    this.pre = node.pre = undefined
+    for (let i = this.stack.length; i--;) {
+      if (this.stack[i].pre) {
+        this.pre = 1
+      }
+    }
+  }
+
+  const styleObj = {}
+
+  // 转换 svg
+  if (node.name === 'svg') {
+    if (this.xml > 1) {
+      // 多层 svg 嵌套
+      this.xml--
+      return
+    }
+    // #ifdef APP-PLUS-NVUE
+    (function traversal (node) {
+      if (node.name) {
+        // 调整 svg 的大小写
+        node.name = config.svgDict[node.name] || node.name
+        for (const item in node.attrs) {
+          if (config.svgDict[item]) {
+            node.attrs[config.svgDict[item]] = node.attrs[item]
+            node.attrs[item] = undefined
+          }
+        }
+        for (let i = 0; i < (node.children || []).length; i++) {
+          traversal(node.children[i])
+        }
+      }
+    })(node)
+    // #endif
+    // #ifndef APP-PLUS-NVUE
+    let src = ''
+    const style = attrs.style
+    attrs.style = ''
+    attrs.xmlns = 'http://www.w3.org/2000/svg';
+    (function traversal (node) {
+      if (node.type === 'text') {
+        src += node.text
+        return
+      }
+      const name = config.svgDict[node.name] || node.name
+      src += '<' + name
+      for (const item in node.attrs) {
+        const val = node.attrs[item]
+        if (val) {
+          src += ` ${config.svgDict[item] || item}="${val}"`
+        }
+      }
+      if (!node.children) {
+        src += '/>'
+      } else {
+        src += '>'
+        for (let i = 0; i < node.children.length; i++) {
+          traversal(node.children[i])
+        }
+        src += '</' + name + '>'
+      }
+    })(node)
+    node.name = 'img'
+    node.attrs = {
+      src: 'data:image/svg+xml;utf8,' + src.replace(/#/g, '%23'),
+      style,
+      ignore: 'T'
+    }
+    node.children = undefined
+    // #endif
+    this.xml = false
+    return
+  }
+
+  // #ifndef APP-PLUS-NVUE
+  // 转换 align 属性
+  if (attrs.align) {
+    if (node.name === 'table') {
+      if (attrs.align === 'center') {
+        styleObj['margin-inline-start'] = styleObj['margin-inline-end'] = 'auto'
+      } else {
+        styleObj.float = attrs.align
+      }
+    } else {
+      styleObj['text-align'] = attrs.align
+    }
+    attrs.align = undefined
+  }
+
+  // 转换 dir 属性
+  if (attrs.dir) {
+    styleObj.direction = attrs.dir
+    attrs.dir = undefined
+  }
+
+  // 转换 font 标签的属性
+  if (node.name === 'font') {
+    if (attrs.color) {
+      styleObj.color = attrs.color
+      attrs.color = undefined
+    }
+    if (attrs.face) {
+      styleObj['font-family'] = attrs.face
+      attrs.face = undefined
+    }
+    if (attrs.size) {
+      let size = parseInt(attrs.size)
+      if (!isNaN(size)) {
+        if (size < 1) {
+          size = 1
+        } else if (size > 7) {
+          size = 7
+        }
+        styleObj['font-size'] = ['x-small', 'small', 'medium', 'large', 'x-large', 'xx-large', 'xxx-large'][size - 1]
+      }
+      attrs.size = undefined
+    }
+  }
+  // #endif
+
+  // 一些编辑器的自带 class
+  if ((attrs.class || '').includes('align-center')) {
+    styleObj['text-align'] = 'center'
+  }
+
+  Object.assign(styleObj, this.parseStyle(node))
+
+  if (node.name !== 'table' && parseInt(styleObj.width) > windowWidth) {
+    styleObj['max-width'] = '100%'
+    styleObj['box-sizing'] = 'border-box'
+  }
+
+  // #ifndef APP-PLUS-NVUE
+  if (config.blockTags[node.name]) {
+    node.name = 'div'
+  } else if (!config.trustTags[node.name] && !this.xml) {
+    // 未知标签转为 span，避免无法显示
+    node.name = 'span'
+  }
+
+  if (node.name === 'a' || node.name === 'ad'
+    // #ifdef H5 || APP-PLUS
+    || node.name === 'iframe' // eslint-disable-line
+    // #endif
+  ) {
+    this.expose()
+  } /* #ifdef APP-PLUS */ else if (node.name === 'video') {
+    let str = '<video style="width:100%;height:100%"'
+    for (const item in attrs) {
+      if (attrs[item]) {
+        str += ' ' + item + '="' + attrs[item] + '"'
+      }
+    }
+    if (this.options.pauseVideo) {
+      str += ' onplay="for(var e=document.getElementsByTagName(\'video\'),t=0;t<e.length;t++)e[t]!=this&&e[t].pause()"'
+    }
+    str += '>'
+    for (let i = 0; i < node.src.length; i++) {
+      str += '<source src="' + node.src[i] + '">'
+    }
+    str += '</video>'
+    node.html = str
+  } /* #endif */ else if ((node.name === 'ul' || node.name === 'ol') && node.c) {
+    // 列表处理
+    const types = {
+      a: 'lower-alpha',
+      A: 'upper-alpha',
+      i: 'lower-roman',
+      I: 'upper-roman'
+    }
+    if (types[attrs.type]) {
+      attrs.style += ';list-style-type:' + types[attrs.type]
+      attrs.type = undefined
+    }
+    for (let i = children.length; i--;) {
+      if (children[i].name === 'li') {
+        children[i].c = 1
+      }
+    }
+  } else if (node.name === 'table') {
+    // 表格处理
+    // cellpadding、cellspacing、border 这几个常用表格属性需要通过转换实现
+    let padding = parseFloat(attrs.cellpadding)
+    let spacing = parseFloat(attrs.cellspacing)
+    const border = parseFloat(attrs.border)
+    if (node.c) {
+      // padding 和 spacing 默认 2
+      if (isNaN(padding)) {
+        padding = 2
+      }
+      if (isNaN(spacing)) {
+        spacing = 2
+      }
+    }
+    if (border) {
+      attrs.style += ';border:' + border + 'px solid gray'
+    }
+    if (node.flag && node.c) {
+      // 有 colspan 或 rowspan 且含有链接的表格通过 grid 布局实现
+      styleObj.display = 'grid'
+      if (spacing) {
+        styleObj['grid-gap'] = spacing + 'px'
+        styleObj.padding = spacing + 'px'
+      } else if (border) {
+        // 无间隔的情况下避免边框重叠
+        attrs.style += ';border-left:0;border-top:0'
+      }
+
+      const width = [] // 表格的列宽
+      const trList = [] // tr 列表
+      const cells = [] // 保存新的单元格
+      const map = {}; // 被合并单元格占用的格子
+
+      (function traversal (nodes) {
+        for (let i = 0; i < nodes.length; i++) {
+          if (nodes[i].name === 'tr') {
+            trList.push(nodes[i])
+          } else {
+            traversal(nodes[i].children || [])
+          }
+        }
+      })(children)
+
+      for (let row = 1; row <= trList.length; row++) {
+        let col = 1
+        for (let j = 0; j < trList[row - 1].children.length; j++, col++) {
+          const td = trList[row - 1].children[j]
+          if (td.name === 'td' || td.name === 'th') {
+            // 这个格子被上面的单元格占用，则列号++
+            while (map[row + '.' + col]) {
+              col++
+            }
+            let style = td.attrs.style || ''
+            const start = style.indexOf('width') ? style.indexOf(';width') : 0
+            // 提取出 td 的宽度
+            if (start !== -1) {
+              let end = style.indexOf(';', start + 6)
+              if (end === -1) {
+                end = style.length
+              }
+              if (!td.attrs.colspan) {
+                width[col] = style.substring(start ? start + 7 : 6, end)
+              }
+              style = style.substr(0, start) + style.substr(end)
+            }
+            style += (border ? `;border:${border}px solid gray` + (spacing ? '' : ';border-right:0;border-bottom:0') : '') + (padding ? `;padding:${padding}px` : '')
+            // 处理列合并
+            if (td.attrs.colspan) {
+              style += `;grid-column-start:${col};grid-column-end:${col + parseInt(td.attrs.colspan)}`
+              if (!td.attrs.rowspan) {
+                style += `;grid-row-start:${row};grid-row-end:${row + 1}`
+              }
+              col += parseInt(td.attrs.colspan) - 1
+            }
+            // 处理行合并
+            if (td.attrs.rowspan) {
+              style += `;grid-row-start:${row};grid-row-end:${row + parseInt(td.attrs.rowspan)}`
+              if (!td.attrs.colspan) {
+                style += `;grid-column-start:${col};grid-column-end:${col + 1}`
+              }
+              // 记录下方单元格被占用
+              for (let rowspan = 1; rowspan < td.attrs.rowspan; rowspan++) {
+                for (let colspan = 0; colspan < (td.attrs.colspan || 1); colspan++) {
+                  map[(row + rowspan) + '.' + (col - colspan)] = 1
+                }
+              }
+            }
+            if (style) {
+              td.attrs.style = style
+            }
+            cells.push(td)
+          }
+        }
+        if (row === 1) {
+          let temp = ''
+          for (let i = 1; i < col; i++) {
+            temp += (width[i] ? width[i] : 'auto') + ' '
+          }
+          styleObj['grid-template-columns'] = temp
+        }
+      }
+      node.children = cells
+    } else {
+      // 没有使用合并单元格的表格通过 table 布局实现
+      if (node.c) {
+        styleObj.display = 'table'
+      }
+      if (!isNaN(spacing)) {
+        styleObj['border-spacing'] = spacing + 'px'
+      }
+      if (border || padding) {
+        // 遍历
+        (function traversal (nodes) {
+          for (let i = 0; i < nodes.length; i++) {
+            const td = nodes[i]
+            if (td.name === 'th' || td.name === 'td') {
+              if (border) {
+                td.attrs.style = `border:${border}px solid gray;${td.attrs.style || ''}`
+              }
+              if (padding) {
+                td.attrs.style = `padding:${padding}px;${td.attrs.style || ''}`
+              }
+            } else if (td.children) {
+              traversal(td.children)
+            }
+          }
+        })(children)
+      }
+    }
+    // 给表格添加一个单独的横向滚动层
+    if (this.options.scrollTable && !(attrs.style || '').includes('inline')) {
+      const table = Object.assign({}, node)
+      node.name = 'div'
+      node.attrs = {
+        style: 'overflow:auto'
+      }
+      node.children = [table]
+      attrs = table.attrs
+    }
+  } else if ((node.name === 'td' || node.name === 'th') && (attrs.colspan || attrs.rowspan)) {
+    for (let i = this.stack.length; i--;) {
+      if (this.stack[i].name === 'table') {
+        this.stack[i].flag = 1 // 指示含有合并单元格
+        break
+      }
+    }
+  } else if (node.name === 'ruby') {
+    // 转换 ruby
+    node.name = 'span'
+    for (let i = 0; i < children.length - 1; i++) {
+      if (children[i].type === 'text' && children[i + 1].name === 'rt') {
+        children[i] = {
+          name: 'div',
+          attrs: {
+            style: 'display:inline-block;text-align:center'
+          },
+          children: [{
+            name: 'div',
+            attrs: {
+              style: 'font-size:50%;' + (children[i + 1].attrs.style || '')
+            },
+            children: children[i + 1].children
+          }, children[i]]
+        }
+        children.splice(i + 1, 1)
+      }
+    }
+  } else if (node.c) {
+    node.c = 2
+    for (let i = node.children.length; i--;) {
+      if (!node.children[i].c || node.children[i].name === 'table') {
+        node.c = 1
+      }
+    }
+  }
+
+  if ((styleObj.display || '').includes('flex') && !node.c) {
+    for (let i = children.length; i--;) {
+      const item = children[i]
+      if (item.f) {
+        item.attrs.style = (item.attrs.style || '') + item.f
+        item.f = undefined
+      }
+    }
+  }
+  // flex 布局时部分样式需要提取到 rich-text 外层
+  const flex = parent && (parent.attrs.style || '').includes('flex')
+    // #ifdef MP-WEIXIN
+    // 检查基础库版本 virtualHost 是否可用
+    && !(node.c && wx.getNFCAdapter) // eslint-disable-line
+    // #endif
+    // #ifndef MP-WEIXIN || MP-QQ || MP-BAIDU || MP-TOUTIAO
+    && !node.c // eslint-disable-line
+  // #endif
+  if (flex) {
+    node.f = ';max-width:100%'
+  }
+  // #endif
+
+  for (const key in styleObj) {
+    if (styleObj[key]) {
+      const val = `;${key}:${styleObj[key].replace(' !important', '')}`
+      /* #ifndef APP-PLUS-NVUE */
+      if (flex && ((key.includes('flex') && key !== 'flex-direction') || key === 'align-self' || styleObj[key][0] === '-' || (key === 'width' && val.includes('%')))) {
+        node.f += val
+        if (key === 'width') {
+          attrs.style += ';width:100%'
+        }
+      } else /* #endif */ {
+        attrs.style += val
+      }
+    }
+  }
+  attrs.style = attrs.style.substr(1) || undefined
+}
+
+/**
+ * @description 解析到文本
+ * @param {String} text 文本内容
+ */
+Parser.prototype.onText = function (text) {
+  if (!this.pre) {
+    // 合并空白符
+    let trim = ''
+    let flag
+    for (let i = 0, len = text.length; i < len; i++) {
+      if (!blankChar[text[i]]) {
+        trim += text[i]
+      } else {
+        if (trim[trim.length - 1] !== ' ') {
+          trim += ' '
+        }
+        if (text[i] === '\n' && !flag) {
+          flag = true
+        }
+      }
+    }
+    // 去除含有换行符的空串
+    if (trim === ' ' && flag) return
+    text = trim
+  }
+  const node = Object.create(null)
+  node.type = 'text'
+  node.text = decodeEntity(text)
+  if (this.hook(node)) {
+    // #ifdef MP-WEIXIN
+    if (this.options.selectable === 'force' && system.includes('iOS')) {
+      this.expose()
+      node.us = 'T'
+    }
+    // #endif
+    const siblings = this.stack.length ? this.stack[this.stack.length - 1].children : this.nodes
+    siblings.push(node)
+  }
+}
+
+/**
+ * @description html 词法分析器
+ * @param {Object} handler 高层处理器
+ */
+function Lexer (handler) {
+  this.handler = handler
+}
+
+/**
+ * @description 执行解析
+ * @param {String} content 要解析的文本
+ */
+Lexer.prototype.parse = function (content) {
+  this.content = content || ''
+  this.i = 0 // 标记解析位置
+  this.start = 0 // 标记一个单词的开始位置
+  this.state = this.text // 当前状态
+  for (let len = this.content.length; this.i !== -1 && this.i < len;) {
+    this.state()
+  }
+}
+
+/**
+ * @description 检查标签是否闭合
+ * @param {String} method 如果闭合要进行的操作
+ * @returns {Boolean} 是否闭合
+ * @private
+ */
+Lexer.prototype.checkClose = function (method) {
+  const selfClose = this.content[this.i] === '/'
+  if (this.content[this.i] === '>' || (selfClose && this.content[this.i + 1] === '>')) {
+    if (method) {
+      this.handler[method](this.content.substring(this.start, this.i))
+    }
+    this.i += selfClose ? 2 : 1
+    this.start = this.i
+    this.handler.onOpenTag(selfClose)
+    if (this.handler.tagName === 'script') {
+      this.i = this.content.indexOf('</', this.i)
+      if (this.i !== -1) {
+        this.i += 2
+        this.start = this.i
+      }
+      this.state = this.endTag
+    } else {
+      this.state = this.text
+    }
+    return true
+  }
+  return false
+}
+
+/**
+ * @description 文本状态
+ * @private
+ */
+Lexer.prototype.text = function () {
+  this.i = this.content.indexOf('<', this.i) // 查找最近的标签
+  if (this.i === -1) {
+    // 没有标签了
+    if (this.start < this.content.length) {
+      this.handler.onText(this.content.substring(this.start, this.content.length))
+    }
+    return
+  }
+  const c = this.content[this.i + 1]
+  if ((c >= 'a' && c <= 'z') || (c >= 'A' && c <= 'Z')) {
+    // 标签开头
+    if (this.start !== this.i) {
+      this.handler.onText(this.content.substring(this.start, this.i))
+    }
+    this.start = ++this.i
+    this.state = this.tagName
+  } else if (c === '/' || c === '!' || c === '?') {
+    if (this.start !== this.i) {
+      this.handler.onText(this.content.substring(this.start, this.i))
+    }
+    const next = this.content[this.i + 2]
+    if (c === '/' && ((next >= 'a' && next <= 'z') || (next >= 'A' && next <= 'Z'))) {
+      // 标签结尾
+      this.i += 2
+      this.start = this.i
+      this.state = this.endTag
+      return
+    }
+    // 处理注释
+    let end = '-->'
+    if (c !== '!' || this.content[this.i + 2] !== '-' || this.content[this.i + 3] !== '-') {
+      end = '>'
+    }
+    this.i = this.content.indexOf(end, this.i)
+    if (this.i !== -1) {
+      this.i += end.length
+      this.start = this.i
+    }
+  } else {
+    this.i++
+  }
+}
+
+/**
+ * @description 标签名状态
+ * @private
+ */
+Lexer.prototype.tagName = function () {
+  if (blankChar[this.content[this.i]]) {
+    // 解析到标签名
+    this.handler.onTagName(this.content.substring(this.start, this.i))
+    while (blankChar[this.content[++this.i]]);
+    if (this.i < this.content.length && !this.checkClose()) {
+      this.start = this.i
+      this.state = this.attrName
+    }
+  } else if (!this.checkClose('onTagName')) {
+    this.i++
+  }
+}
+
+/**
+ * @description 属性名状态
+ * @private
+ */
+Lexer.prototype.attrName = function () {
+  let c = this.content[this.i]
+  if (blankChar[c] || c === '=') {
+    // 解析到属性名
+    this.handler.onAttrName(this.content.substring(this.start, this.i))
+    let needVal = c === '='
+    const len = this.content.length
+    while (++this.i < len) {
+      c = this.content[this.i]
+      if (!blankChar[c]) {
+        if (this.checkClose()) return
+        if (needVal) {
+          // 等号后遇到第一个非空字符
+          this.start = this.i
+          this.state = this.attrVal
+          return
+        }
+        if (this.content[this.i] === '=') {
+          needVal = true
+        } else {
+          this.start = this.i
+          this.state = this.attrName
+          return
+        }
+      }
+    }
+  } else if (!this.checkClose('onAttrName')) {
+    this.i++
+  }
+}
+
+/**
+ * @description 属性值状态
+ * @private
+ */
+Lexer.prototype.attrVal = function () {
+  const c = this.content[this.i]
+  const len = this.content.length
+  if (c === '"' || c === "'") {
+    // 有冒号的属性
+    this.start = ++this.i
+    this.i = this.content.indexOf(c, this.i)
+    if (this.i === -1) return
+    this.handler.onAttrVal(this.content.substring(this.start, this.i))
+  } else {
+    // 没有冒号的属性
+    for (; this.i < len; this.i++) {
+      if (blankChar[this.content[this.i]]) {
+        this.handler.onAttrVal(this.content.substring(this.start, this.i))
+        break
+      } else if (this.checkClose('onAttrVal')) return
+    }
+  }
+  while (blankChar[this.content[++this.i]]);
+  if (this.i < len && !this.checkClose()) {
+    this.start = this.i
+    this.state = this.attrName
+  }
+}
+
+/**
+ * @description 结束标签状态
+ * @returns {String} 结束的标签名
+ * @private
+ */
+Lexer.prototype.endTag = function () {
+  const c = this.content[this.i]
+  if (blankChar[c] || c === '>' || c === '/') {
+    this.handler.onCloseTag(this.content.substring(this.start, this.i))
+    if (c !== '>') {
+      this.i = this.content.indexOf('>', this.i)
+      if (this.i === -1) return
+    }
+    this.start = ++this.i
+    this.state = this.text
+  } else {
+    this.i++
+  }
+}
+
+module.exports = Parser

uni_modules/mp-html/package.json

@@ -0,0 +1,79 @@
+{
+    "id": "mp-html",
+    "displayName": "mp-html 富文本组件【全端支持，可编辑】",
+    "version": "v2.2.1",
+    "description": "一个强大的富文本组件，高效轻量，功能丰富",
+    "keywords": [
+        "富文本",
+        "编辑器",
+        "html",
+        "rich-text",
+        "editor"
+    ],
+    "repository": "https://github.com/jin-yufeng/mp-html",
+    "dcloudext": {
+        "category": [
+            "前端组件",
+            "通用组件"
+        ],
+        "sale": {
+            "regular": {
+                "price": "0.00"
+            },
+            "sourcecode": {
+                "price": "0.00"
+            }
+        },
+        "contact": {
+            "qq": ""
+        },
+        "declaration": {
+            "ads": "无",
+            "data": "无",
+            "permissions": "无"
+        },
+        "npmurl": "https://www.npmjs.com/package/mp-html"
+    },
+    "uni_modules": {
+        "platforms": {
+            "cloud": {
+                "tcb": "y",
+                "aliyun": "y"
+            },
+            "client": {
+                "App": {
+                    "app-vue": "y",
+                    "app-nvue": "y"
+                },
+                "H5-mobile": {
+                    "Safari": "y",
+                    "Android Browser": "y",
+                    "微信浏览器(Android)": "y",
+                    "QQ浏览器(Android)": "y"
+                },
+                "H5-pc": {
+                    "Chrome": "y",
+                    "IE": "u",
+                    "Edge": "y",
+                    "Firefox": "y",
+                    "Safari": "y"
+                },
+                "小程序": {
+                    "微信": "y",
+                    "阿里": "y",
+                    "百度": "y",
+                    "字节跳动": "y",
+                    "QQ": "y"
+                },
+                "快应用": {
+                    "华为": "y",
+                    "联盟": "y"
+                },
+                "Vue": {
+                    "vue2": "y",
+                    "vue3": "u"
+                }
+            }
+        }
+    }
+}

uni_modules/mp-html/static/app-plus/mp-html/local.html

@@ -0,0 +1 @@
+<head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"><style>body,html{width:100%;height:100%;overflow-x:scroll;overflow-y:hidden}body{margin:0}video{width:300px;height:225px}img{max-width:100%;-webkit-touch-callout:none}</style></head><body><div id="content" style="overflow:hidden"></div><script type="text/javascript" src="./js/uni.webview.min.js"></script><script type="text/javascript" src="./js/handler.js"></script></body>