jiazhipeng
2 years ago
15 changed files with 4598 additions and 4 deletions
|
Before Width: | Height: | Size: 311 KiB |
|
After Width: | Height: | Size: 1.8 KiB |
@ -0,0 +1,303 @@ |
|||||
|
/** |
||||
|
* html2Json 改造来自: https://github.com/Jxck/html2json
|
||||
|
* |
||||
|
* |
||||
|
* author: Di (微信小程序开发工程师) |
||||
|
* organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com)
|
||||
|
* 垂直微信小程序开发交流社区 |
||||
|
* |
||||
|
* github地址: https://github.com/icindy/wxParse
|
||||
|
* |
||||
|
* for: 微信小程序富文本解析 |
||||
|
* detail : http://weappdev.com/t/wxparse-alpha0-1-html-markdown/184
|
||||
|
*/ |
||||
|
|
||||
|
var __placeImgeUrlHttps = "https"; |
||||
|
var __emojisReg = ''; |
||||
|
var __emojisBaseSrc = ''; |
||||
|
var __emojis = {}; |
||||
|
var wxDiscode = require('./wxDiscode.js'); |
||||
|
var HTMLParser = require('./htmlparser.js'); |
||||
|
// Empty Elements - HTML 5
|
||||
|
var empty = makeMap("area,base,basefont,br,col,frame,hr,img,input,link,meta,param,embed,command,keygen,source,track,wbr"); |
||||
|
// Block Elements - HTML 5
|
||||
|
var block = makeMap("br,a,code,address,article,applet,aside,audio,blockquote,button,canvas,center,dd,del,dir,div,dl,dt,fieldset,figcaption,figure,footer,form,frameset,h1,h2,h3,h4,h5,h6,header,hgroup,hr,iframe,ins,isindex,li,map,menu,noframes,noscript,object,ol,output,p,pre,section,script,table,tbody,td,tfoot,th,thead,tr,ul,video"); |
||||
|
|
||||
|
// Inline Elements - HTML 5
|
||||
|
var inline = makeMap("abbr,acronym,applet,b,basefont,bdo,big,button,cite,del,dfn,em,font,i,iframe,img,input,ins,kbd,label,map,object,q,s,samp,script,select,small,span,strike,strong,sub,sup,textarea,tt,u,var"); |
||||
|
|
||||
|
// Elements that you can, intentionally, leave open
|
||||
|
// (and which close themselves)
|
||||
|
var closeSelf = makeMap("colgroup,dd,dt,li,options,p,td,tfoot,th,thead,tr"); |
||||
|
|
||||
|
// Attributes that have their values filled in disabled="disabled"
|
||||
|
var fillAttrs = makeMap("checked,compact,declare,defer,disabled,ismap,multiple,nohref,noresize,noshade,nowrap,readonly,selected"); |
||||
|
|
||||
|
// Special Elements (can contain anything)
|
||||
|
var special = makeMap("wxxxcode-style,script,style,view,scroll-view,block"); |
||||
|
function makeMap(str) { |
||||
|
var obj = {}, items = str.split(","); |
||||
|
for (var i = 0; i < items.length; i++) |
||||
|
obj[items[i]] = true; |
||||
|
return obj; |
||||
|
} |
||||
|
|
||||
|
function q(v) { |
||||
|
return '"' + v + '"'; |
||||
|
} |
||||
|
|
||||
|
function removeDOCTYPE(html) { |
||||
|
return html |
||||
|
.replace(/<\?xml.*\?>\n/, '') |
||||
|
.replace(/<.*!doctype.*\>\n/, '') |
||||
|
.replace(/<.*!DOCTYPE.*\>\n/, ''); |
||||
|
} |
||||
|
|
||||
|
function trimHtml(html) { |
||||
|
return html |
||||
|
.replace(/\r?\n+/g, '') |
||||
|
.replace(/<!--.*?-->/ig, '') |
||||
|
.replace(/\/\*.*?\*\//ig, '') |
||||
|
.replace(/[ ]+</ig, '<') |
||||
|
} |
||||
|
|
||||
|
|
||||
|
function html2json(html, bindName) { |
||||
|
//处理字符串
|
||||
|
html = removeDOCTYPE(html); |
||||
|
html = trimHtml(html); |
||||
|
html = wxDiscode.strDiscode(html); |
||||
|
//生成node节点
|
||||
|
var bufArray = []; |
||||
|
var results = { |
||||
|
node: bindName, |
||||
|
nodes: [], |
||||
|
images:[], |
||||
|
imageUrls:[] |
||||
|
}; |
||||
|
var index = 0; |
||||
|
HTMLParser(html, { |
||||
|
start: function (tag, attrs, unary) { |
||||
|
//debug(tag, attrs, unary);
|
||||
|
// node for this element
|
||||
|
var node = { |
||||
|
node: 'element', |
||||
|
tag: tag, |
||||
|
}; |
||||
|
|
||||
|
if (bufArray.length === 0) { |
||||
|
node.index = index.toString() |
||||
|
index += 1 |
||||
|
} else { |
||||
|
var parent = bufArray[0]; |
||||
|
if (parent.nodes === undefined) { |
||||
|
parent.nodes = []; |
||||
|
} |
||||
|
node.index = parent.index + '.' + parent.nodes.length |
||||
|
} |
||||
|
|
||||
|
if (block[tag]) { |
||||
|
node.tagType = "block"; |
||||
|
} else if (inline[tag]) { |
||||
|
node.tagType = "inline"; |
||||
|
} else if (closeSelf[tag]) { |
||||
|
node.tagType = "closeSelf"; |
||||
|
} |
||||
|
|
||||
|
if (attrs.length !== 0) { |
||||
|
node.attr = attrs.reduce(function (pre, attr) { |
||||
|
var name = attr.name; |
||||
|
var value = attr.value; |
||||
|
if (name == 'class') { |
||||
|
console.dir(value); |
||||
|
// value = value.join("")
|
||||
|
node.classStr = value; |
||||
|
} |
||||
|
// has multi attibutes
|
||||
|
// make it array of attribute
|
||||
|
if (name == 'style') { |
||||
|
console.dir(value); |
||||
|
// value = value.join("")
|
||||
|
node.styleStr = value; |
||||
|
} |
||||
|
if (value.match(/ /)) { |
||||
|
value = value.split(' '); |
||||
|
} |
||||
|
|
||||
|
|
||||
|
// if attr already exists
|
||||
|
// merge it
|
||||
|
if (pre[name]) { |
||||
|
if (Array.isArray(pre[name])) { |
||||
|
// already array, push to last
|
||||
|
pre[name].push(value); |
||||
|
} else { |
||||
|
// single value, make it array
|
||||
|
pre[name] = [pre[name], value]; |
||||
|
} |
||||
|
} else { |
||||
|
// not exist, put it
|
||||
|
pre[name] = value; |
||||
|
} |
||||
|
|
||||
|
return pre; |
||||
|
}, {}); |
||||
|
} |
||||
|
|
||||
|
//对img添加额外数据
|
||||
|
if (node.tag === 'img') { |
||||
|
node.imgIndex = results.images.length; |
||||
|
var imgUrl = node.attr.src; |
||||
|
if (imgUrl[0] == '') { |
||||
|
imgUrl.splice(0, 1); |
||||
|
} |
||||
|
imgUrl = wxDiscode.urlToHttpUrl(imgUrl, __placeImgeUrlHttps); |
||||
|
node.attr.src = imgUrl; |
||||
|
node.from = bindName; |
||||
|
results.images.push(node); |
||||
|
results.imageUrls.push(imgUrl); |
||||
|
} |
||||
|
|
||||
|
// 处理font标签样式属性
|
||||
|
if (node.tag === 'font') { |
||||
|
var fontSize = ['x-small', 'small', 'medium', 'large', 'x-large', 'xx-large', '-webkit-xxx-large']; |
||||
|
var styleAttrs = { |
||||
|
'color': 'color', |
||||
|
'face': 'font-family', |
||||
|
'size': 'font-size' |
||||
|
}; |
||||
|
if (!node.attr.style) node.attr.style = []; |
||||
|
if (!node.styleStr) node.styleStr = ''; |
||||
|
for (var key in styleAttrs) { |
||||
|
if (node.attr[key]) { |
||||
|
var value = key === 'size' ? fontSize[node.attr[key]-1] : node.attr[key]; |
||||
|
node.attr.style.push(styleAttrs[key]); |
||||
|
node.attr.style.push(value); |
||||
|
node.styleStr += styleAttrs[key] + ': ' + value + ';'; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
//临时记录source资源
|
||||
|
if(node.tag === 'source'){ |
||||
|
results.source = node.attr.src; |
||||
|
} |
||||
|
|
||||
|
if (unary) { |
||||
|
// if this tag doesn't have end tag
|
||||
|
// like <img src="hoge.png"/>
|
||||
|
// add to parents
|
||||
|
var parent = bufArray[0] || results; |
||||
|
if (parent.nodes === undefined) { |
||||
|
parent.nodes = []; |
||||
|
} |
||||
|
parent.nodes.push(node); |
||||
|
} else { |
||||
|
bufArray.unshift(node); |
||||
|
} |
||||
|
}, |
||||
|
end: function (tag) { |
||||
|
//debug(tag);
|
||||
|
// merge into parent tag
|
||||
|
var node = bufArray.shift(); |
||||
|
if (node.tag !== tag) console.error('invalid state: mismatch end tag'); |
||||
|
|
||||
|
//当有缓存source资源时于于video补上src资源
|
||||
|
if(node.tag === 'video' && results.source){ |
||||
|
node.attr.src = results.source; |
||||
|
delete results.source; |
||||
|
} |
||||
|
|
||||
|
if (bufArray.length === 0) { |
||||
|
results.nodes.push(node); |
||||
|
} else { |
||||
|
var parent = bufArray[0]; |
||||
|
if (parent.nodes === undefined) { |
||||
|
parent.nodes = []; |
||||
|
} |
||||
|
parent.nodes.push(node); |
||||
|
} |
||||
|
}, |
||||
|
chars: function (text) { |
||||
|
//debug(text);
|
||||
|
var node = { |
||||
|
node: 'text', |
||||
|
text: text, |
||||
|
textArray:transEmojiStr(text) |
||||
|
}; |
||||
|
|
||||
|
if (bufArray.length === 0) { |
||||
|
node.index = index.toString() |
||||
|
index += 1 |
||||
|
results.nodes.push(node); |
||||
|
} else { |
||||
|
var parent = bufArray[0]; |
||||
|
if (parent.nodes === undefined) { |
||||
|
parent.nodes = []; |
||||
|
} |
||||
|
node.index = parent.index + '.' + parent.nodes.length |
||||
|
parent.nodes.push(node); |
||||
|
} |
||||
|
}, |
||||
|
comment: function (text) { |
||||
|
//debug(text);
|
||||
|
// var node = {
|
||||
|
// node: 'comment',
|
||||
|
// text: text,
|
||||
|
// };
|
||||
|
// var parent = bufArray[0];
|
||||
|
// if (parent.nodes === undefined) {
|
||||
|
// parent.nodes = [];
|
||||
|
// }
|
||||
|
// parent.nodes.push(node);
|
||||
|
}, |
||||
|
}); |
||||
|
return results; |
||||
|
}; |
||||
|
|
||||
|
function transEmojiStr(str){ |
||||
|
// var eReg = new RegExp("["+__reg+' '+"]");
|
||||
|
// str = str.replace(/\[([^\[\]]+)\]/g,':$1:')
|
||||
|
|
||||
|
var emojiObjs = []; |
||||
|
//如果正则表达式为空
|
||||
|
if(__emojisReg.length == 0 || !__emojis){ |
||||
|
var emojiObj = {} |
||||
|
emojiObj.node = "text"; |
||||
|
emojiObj.text = str; |
||||
|
array = [emojiObj]; |
||||
|
return array; |
||||
|
} |
||||
|
//这个地方需要调整
|
||||
|
str = str.replace(/\[([^\[\]]+)\]/g,':$1:') |
||||
|
var eReg = new RegExp("[:]"); |
||||
|
var array = str.split(eReg); |
||||
|
for(var i = 0; i < array.length; i++){ |
||||
|
var ele = array[i]; |
||||
|
var emojiObj = {}; |
||||
|
if(__emojis[ele]){ |
||||
|
emojiObj.node = "element"; |
||||
|
emojiObj.tag = "emoji"; |
||||
|
emojiObj.text = __emojis[ele]; |
||||
|
emojiObj.baseSrc= __emojisBaseSrc; |
||||
|
}else{ |
||||
|
emojiObj.node = "text"; |
||||
|
emojiObj.text = ele; |
||||
|
} |
||||
|
emojiObjs.push(emojiObj); |
||||
|
} |
||||
|
|
||||
|
return emojiObjs; |
||||
|
} |
||||
|
|
||||
|
function emojisInit(reg='',baseSrc="/wxParse/emojis/",emojis){ |
||||
|
__emojisReg = reg; |
||||
|
__emojisBaseSrc=baseSrc; |
||||
|
__emojis=emojis; |
||||
|
} |
||||
|
|
||||
|
module.exports = { |
||||
|
html2json: html2json, |
||||
|
emojisInit:emojisInit |
||||
|
}; |
||||
|
|
||||
@ -0,0 +1,192 @@ |
|||||
|
/** |
||||
|
* |
||||
|
* htmlParser改造自: https://github.com/blowsie/Pure-JavaScript-HTML5-Parser
|
||||
|
* |
||||
|
* author: Di (微信小程序开发工程师) |
||||
|
* organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com)
|
||||
|
* 垂直微信小程序开发交流社区 |
||||
|
* |
||||
|
* github地址: https://github.com/icindy/wxParse
|
||||
|
* |
||||
|
* for: 微信小程序富文本解析 |
||||
|
* detail : http://weappdev.com/t/wxparse-alpha0-1-html-markdown/184
|
||||
|
*/ |
||||
|
// Regular Expressions for parsing tags and attributes
|
||||
|
var startTag = /^<([-A-Za-z0-9_]+)((?:\s+[a-zA-Z_:][-a-zA-Z0-9_:.]*(?:\s*=\s*(?:(?:"[^"]*")|(?:'[^']*')|[^>\s]+))?)*)\s*(\/?)>/, |
||||
|
endTag = /^<\/([-A-Za-z0-9_]+)[^>]*>/, |
||||
|
attr = /([a-zA-Z_:][-a-zA-Z0-9_:.]*)(?:\s*=\s*(?:(?:"((?:\\.|[^"])*)")|(?:'((?:\\.|[^'])*)')|([^>\s]+)))?/g; |
||||
|
|
||||
|
// Empty Elements - HTML 5
|
||||
|
var empty = makeMap("area,base,basefont,br,col,frame,hr,img,input,link,meta,param,embed,command,keygen,source,track,wbr"); |
||||
|
|
||||
|
// Block Elements - HTML 5
|
||||
|
var block = makeMap("a,address,code,article,applet,aside,audio,blockquote,button,canvas,center,dd,del,dir,div,dl,dt,fieldset,figcaption,figure,footer,form,frameset,h1,h2,h3,h4,h5,h6,header,hgroup,hr,iframe,ins,isindex,li,map,menu,noframes,noscript,object,ol,output,p,pre,section,script,table,tbody,td,tfoot,th,thead,tr,ul,video"); |
||||
|
|
||||
|
// Inline Elements - HTML 5
|
||||
|
var inline = makeMap("abbr,acronym,applet,b,basefont,bdo,big,br,button,cite,del,dfn,em,font,i,iframe,img,input,ins,kbd,label,map,object,q,s,samp,script,select,small,span,strike,strong,sub,sup,textarea,tt,u,var"); |
||||
|
|
||||
|
// Elements that you can, intentionally, leave open
|
||||
|
// (and which close themselves)
|
||||
|
var closeSelf = makeMap("colgroup,dd,dt,li,options,p,td,tfoot,th,thead,tr"); |
||||
|
|
||||
|
// Attributes that have their values filled in disabled="disabled"
|
||||
|
var fillAttrs = makeMap("checked,compact,declare,defer,disabled,ismap,multiple,nohref,noresize,noshade,nowrap,readonly,selected"); |
||||
|
|
||||
|
// Special Elements (can contain anything)
|
||||
|
var special = makeMap("wxxxcode-style,script,style,view,scroll-view,block"); |
||||
|
|
||||
|
function HTMLParser(html, handler) { |
||||
|
var index, chars, match, stack = [], last = html; |
||||
|
stack.last = function () { |
||||
|
return this[this.length - 1]; |
||||
|
}; |
||||
|
|
||||
|
while (html) { |
||||
|
chars = true; |
||||
|
|
||||
|
// Make sure we're not in a script or style element
|
||||
|
if (!stack.last() || !special[stack.last()]) { |
||||
|
|
||||
|
// Comment
|
||||
|
if (html.indexOf("<!--") == 0) { |
||||
|
index = html.indexOf("-->"); |
||||
|
|
||||
|
if (index >= 0) { |
||||
|
if (handler.comment) |
||||
|
handler.comment(html.substring(4, index)); |
||||
|
html = html.substring(index + 3); |
||||
|
chars = false; |
||||
|
} |
||||
|
|
||||
|
// end tag
|
||||
|
} else if (html.indexOf("</") == 0) { |
||||
|
match = html.match(endTag); |
||||
|
|
||||
|
if (match) { |
||||
|
html = html.substring(match[0].length); |
||||
|
match[0].replace(endTag, parseEndTag); |
||||
|
chars = false; |
||||
|
} |
||||
|
|
||||
|
// start tag
|
||||
|
} else if (html.indexOf("<") == 0) { |
||||
|
match = html.match(startTag); |
||||
|
|
||||
|
if (match) { |
||||
|
html = html.substring(match[0].length); |
||||
|
match[0].replace(startTag, parseStartTag); |
||||
|
chars = false; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
if (chars) { |
||||
|
index = html.indexOf("<"); |
||||
|
var text = '' |
||||
|
while (index === 0) { |
||||
|
text += "<"; |
||||
|
html = html.substring(1); |
||||
|
index = html.indexOf("<"); |
||||
|
} |
||||
|
text += index < 0 ? html : html.substring(0, index); |
||||
|
html = index < 0 ? "" : html.substring(index); |
||||
|
|
||||
|
if (handler.chars) |
||||
|
handler.chars(text); |
||||
|
} |
||||
|
|
||||
|
} else { |
||||
|
|
||||
|
html = html.replace(new RegExp("([\\s\\S]*?)<\/" + stack.last() + "[^>]*>"), function (all, text) { |
||||
|
text = text.replace(/<!--([\s\S]*?)-->|<!\[CDATA\[([\s\S]*?)]]>/g, "$1$2"); |
||||
|
if (handler.chars) |
||||
|
handler.chars(text); |
||||
|
|
||||
|
return ""; |
||||
|
}); |
||||
|
|
||||
|
|
||||
|
parseEndTag("", stack.last()); |
||||
|
} |
||||
|
|
||||
|
if (html == last) |
||||
|
throw "Parse Error: " + html; |
||||
|
last = html; |
||||
|
} |
||||
|
|
||||
|
// Clean up any remaining tags
|
||||
|
parseEndTag(); |
||||
|
|
||||
|
function parseStartTag(tag, tagName, rest, unary) { |
||||
|
tagName = tagName.toLowerCase(); |
||||
|
|
||||
|
if (block[tagName]) { |
||||
|
while (stack.last() && inline[stack.last()]) { |
||||
|
parseEndTag("", stack.last()); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
if (closeSelf[tagName] && stack.last() == tagName) { |
||||
|
parseEndTag("", tagName); |
||||
|
} |
||||
|
|
||||
|
unary = empty[tagName] || !!unary; |
||||
|
|
||||
|
if (!unary) |
||||
|
stack.push(tagName); |
||||
|
|
||||
|
if (handler.start) { |
||||
|
var attrs = []; |
||||
|
|
||||
|
rest.replace(attr, function (match, name) { |
||||
|
var value = arguments[2] ? arguments[2] : |
||||
|
arguments[3] ? arguments[3] : |
||||
|
arguments[4] ? arguments[4] : |
||||
|
fillAttrs[name] ? name : ""; |
||||
|
|
||||
|
attrs.push({ |
||||
|
name: name, |
||||
|
value: value, |
||||
|
escaped: value.replace(/(^|[^\\])"/g, '$1\\\"') //"
|
||||
|
}); |
||||
|
}); |
||||
|
|
||||
|
if (handler.start) { |
||||
|
handler.start(tagName, attrs, unary); |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
function parseEndTag(tag, tagName) { |
||||
|
// If no tag name is provided, clean shop
|
||||
|
if (!tagName) |
||||
|
var pos = 0; |
||||
|
|
||||
|
// Find the closest opened tag of the same type
|
||||
|
else { |
||||
|
tagName = tagName.toLowerCase(); |
||||
|
for (var pos = stack.length - 1; pos >= 0; pos--) |
||||
|
if (stack[pos] == tagName) |
||||
|
break; |
||||
|
} |
||||
|
if (pos >= 0) { |
||||
|
// Close all the open elements, up the stack
|
||||
|
for (var i = stack.length - 1; i >= pos; i--) |
||||
|
if (handler.end) |
||||
|
handler.end(stack[i]); |
||||
|
|
||||
|
// Remove the open elements from the stack
|
||||
|
stack.length = pos; |
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
|
||||
|
function makeMap(str) { |
||||
|
var obj = {}, items = str.split(","); |
||||
|
for (var i = 0; i < items.length; i++) |
||||
|
obj[items[i]] = true; |
||||
|
return obj; |
||||
|
} |
||||
|
|
||||
|
module.exports = HTMLParser; |
||||
File diff suppressed because it is too large
@ -0,0 +1,207 @@ |
|||||
|
// HTML 支持的数学符号
|
||||
|
function strNumDiscode(str){ |
||||
|
str = str.replace(/∀/g, '∀'); |
||||
|
str = str.replace(/∂/g, '∂'); |
||||
|
str = str.replace(/&exists;/g, '∃'); |
||||
|
str = str.replace(/∅/g, '∅'); |
||||
|
str = str.replace(/∇/g, '∇'); |
||||
|
str = str.replace(/∈/g, '∈'); |
||||
|
str = str.replace(/∉/g, '∉'); |
||||
|
str = str.replace(/∋/g, '∋'); |
||||
|
str = str.replace(/∏/g, '∏'); |
||||
|
str = str.replace(/∑/g, '∑'); |
||||
|
str = str.replace(/−/g, '−'); |
||||
|
str = str.replace(/∗/g, '∗'); |
||||
|
str = str.replace(/√/g, '√'); |
||||
|
str = str.replace(/∝/g, '∝'); |
||||
|
str = str.replace(/∞/g, '∞'); |
||||
|
str = str.replace(/∠/g, '∠'); |
||||
|
str = str.replace(/∧/g, '∧'); |
||||
|
str = str.replace(/∨/g, '∨'); |
||||
|
str = str.replace(/∩/g, '∩'); |
||||
|
str = str.replace(/∩/g, '∪'); |
||||
|
str = str.replace(/∫/g, '∫'); |
||||
|
str = str.replace(/∴/g, '∴'); |
||||
|
str = str.replace(/∼/g, '∼'); |
||||
|
str = str.replace(/≅/g, '≅'); |
||||
|
str = str.replace(/≈/g, '≈'); |
||||
|
str = str.replace(/≠/g, '≠'); |
||||
|
str = str.replace(/≤/g, '≤'); |
||||
|
str = str.replace(/≥/g, '≥'); |
||||
|
str = str.replace(/⊂/g, '⊂'); |
||||
|
str = str.replace(/⊃/g, '⊃'); |
||||
|
str = str.replace(/⊄/g, '⊄'); |
||||
|
str = str.replace(/⊆/g, '⊆'); |
||||
|
str = str.replace(/⊇/g, '⊇'); |
||||
|
str = str.replace(/⊕/g, '⊕'); |
||||
|
str = str.replace(/⊗/g, '⊗'); |
||||
|
str = str.replace(/⊥/g, '⊥'); |
||||
|
str = str.replace(/⋅/g, '⋅'); |
||||
|
return str; |
||||
|
} |
||||
|
|
||||
|
//HTML 支持的希腊字母
|
||||
|
function strGreeceDiscode(str){ |
||||
|
str = str.replace(/Α/g, 'Α'); |
||||
|
str = str.replace(/Β/g, 'Β'); |
||||
|
str = str.replace(/Γ/g, 'Γ'); |
||||
|
str = str.replace(/Δ/g, 'Δ'); |
||||
|
str = str.replace(/Ε/g, 'Ε'); |
||||
|
str = str.replace(/Ζ/g, 'Ζ'); |
||||
|
str = str.replace(/Η/g, 'Η'); |
||||
|
str = str.replace(/Θ/g, 'Θ'); |
||||
|
str = str.replace(/Ι/g, 'Ι'); |
||||
|
str = str.replace(/Κ/g, 'Κ'); |
||||
|
str = str.replace(/Λ/g, 'Λ'); |
||||
|
str = str.replace(/Μ/g, 'Μ'); |
||||
|
str = str.replace(/Ν/g, 'Ν'); |
||||
|
str = str.replace(/Ξ/g, 'Ν'); |
||||
|
str = str.replace(/Ο/g, 'Ο'); |
||||
|
str = str.replace(/Π/g, 'Π'); |
||||
|
str = str.replace(/Ρ/g, 'Ρ'); |
||||
|
str = str.replace(/Σ/g, 'Σ'); |
||||
|
str = str.replace(/Τ/g, 'Τ'); |
||||
|
str = str.replace(/Υ/g, 'Υ'); |
||||
|
str = str.replace(/Φ/g, 'Φ'); |
||||
|
str = str.replace(/Χ/g, 'Χ'); |
||||
|
str = str.replace(/Ψ/g, 'Ψ'); |
||||
|
str = str.replace(/Ω/g, 'Ω'); |
||||
|
|
||||
|
str = str.replace(/α/g, 'α'); |
||||
|
str = str.replace(/β/g, 'β'); |
||||
|
str = str.replace(/γ/g, 'γ'); |
||||
|
str = str.replace(/δ/g, 'δ'); |
||||
|
str = str.replace(/ε/g, 'ε'); |
||||
|
str = str.replace(/ζ/g, 'ζ'); |
||||
|
str = str.replace(/η/g, 'η'); |
||||
|
str = str.replace(/θ/g, 'θ'); |
||||
|
str = str.replace(/ι/g, 'ι'); |
||||
|
str = str.replace(/κ/g, 'κ'); |
||||
|
str = str.replace(/λ/g, 'λ'); |
||||
|
str = str.replace(/μ/g, 'μ'); |
||||
|
str = str.replace(/ν/g, 'ν'); |
||||
|
str = str.replace(/ξ/g, 'ξ'); |
||||
|
str = str.replace(/ο/g, 'ο'); |
||||
|
str = str.replace(/π/g, 'π'); |
||||
|
str = str.replace(/ρ/g, 'ρ'); |
||||
|
str = str.replace(/ς/g, 'ς'); |
||||
|
str = str.replace(/σ/g, 'σ'); |
||||
|
str = str.replace(/τ/g, 'τ'); |
||||
|
str = str.replace(/υ/g, 'υ'); |
||||
|
str = str.replace(/φ/g, 'φ'); |
||||
|
str = str.replace(/χ/g, 'χ'); |
||||
|
str = str.replace(/ψ/g, 'ψ'); |
||||
|
str = str.replace(/ω/g, 'ω'); |
||||
|
str = str.replace(/ϑ/g, 'ϑ'); |
||||
|
str = str.replace(/ϒ/g, 'ϒ'); |
||||
|
str = str.replace(/ϖ/g, 'ϖ'); |
||||
|
str = str.replace(/·/g, '·'); |
||||
|
return str; |
||||
|
} |
||||
|
|
||||
|
//
|
||||
|
|
||||
|
function strcharacterDiscode(str){ |
||||
|
// 加入常用解析
|
||||
|
str = str.replace(/ /g, ' '); |
||||
|
str = str.replace(/"/g, "'"); |
||||
|
str = str.replace(/&/g, '&'); |
||||
|
// str = str.replace(/</g, '‹');
|
||||
|
// str = str.replace(/>/g, '›');
|
||||
|
|
||||
|
str = str.replace(/</g, '<'); |
||||
|
str = str.replace(/>/g, '>'); |
||||
|
str = str.replace(/•/g, '•'); |
||||
|
|
||||
|
return str; |
||||
|
} |
||||
|
|
||||
|
// HTML 支持的其他实体
|
||||
|
function strOtherDiscode(str){ |
||||
|
str = str.replace(/Œ/g, 'Œ'); |
||||
|
str = str.replace(/œ/g, 'œ'); |
||||
|
str = str.replace(/Š/g, 'Š'); |
||||
|
str = str.replace(/š/g, 'š'); |
||||
|
str = str.replace(/Ÿ/g, 'Ÿ'); |
||||
|
str = str.replace(/ƒ/g, 'ƒ'); |
||||
|
str = str.replace(/ˆ/g, 'ˆ'); |
||||
|
str = str.replace(/˜/g, '˜'); |
||||
|
str = str.replace(/ /g, ''); |
||||
|
str = str.replace(/ /g, ''); |
||||
|
str = str.replace(/ /g, ''); |
||||
|
str = str.replace(/‌/g, ''); |
||||
|
str = str.replace(/‍/g, ''); |
||||
|
str = str.replace(/‎/g, ''); |
||||
|
str = str.replace(/‏/g, ''); |
||||
|
str = str.replace(/–/g, '–'); |
||||
|
str = str.replace(/—/g, '—'); |
||||
|
str = str.replace(/‘/g, '‘'); |
||||
|
str = str.replace(/’/g, '’'); |
||||
|
str = str.replace(/‚/g, '‚'); |
||||
|
str = str.replace(/“/g, '“'); |
||||
|
str = str.replace(/”/g, '”'); |
||||
|
str = str.replace(/„/g, '„'); |
||||
|
str = str.replace(/†/g, '†'); |
||||
|
str = str.replace(/‡/g, '‡'); |
||||
|
str = str.replace(/•/g, '•'); |
||||
|
str = str.replace(/…/g, '…'); |
||||
|
str = str.replace(/‰/g, '‰'); |
||||
|
str = str.replace(/′/g, '′'); |
||||
|
str = str.replace(/″/g, '″'); |
||||
|
str = str.replace(/‹/g, '‹'); |
||||
|
str = str.replace(/›/g, '›'); |
||||
|
str = str.replace(/‾/g, '‾'); |
||||
|
str = str.replace(/€/g, '€'); |
||||
|
str = str.replace(/™/g, '™'); |
||||
|
|
||||
|
str = str.replace(/←/g, '←'); |
||||
|
str = str.replace(/↑/g, '↑'); |
||||
|
str = str.replace(/→/g, '→'); |
||||
|
str = str.replace(/↓/g, '↓'); |
||||
|
str = str.replace(/↔/g, '↔'); |
||||
|
str = str.replace(/↵/g, '↵'); |
||||
|
str = str.replace(/⌈/g, '⌈'); |
||||
|
str = str.replace(/⌉/g, '⌉'); |
||||
|
|
||||
|
str = str.replace(/⌊/g, '⌊'); |
||||
|
str = str.replace(/⌋/g, '⌋'); |
||||
|
str = str.replace(/◊/g, '◊'); |
||||
|
str = str.replace(/♠/g, '♠'); |
||||
|
str = str.replace(/♣/g, '♣'); |
||||
|
str = str.replace(/♥/g, '♥'); |
||||
|
|
||||
|
str = str.replace(/♦/g, '♦'); |
||||
|
str = str.replace(/'/g, '\''); |
||||
|
return str; |
||||
|
} |
||||
|
|
||||
|
function strMoreDiscode(str){ |
||||
|
str = str.replace(/\r\n/g,""); |
||||
|
str = str.replace(/\n/g,""); |
||||
|
|
||||
|
str = str.replace(/code/g,"wxxxcode-style"); |
||||
|
return str; |
||||
|
} |
||||
|
|
||||
|
function strDiscode(str){ |
||||
|
str = strNumDiscode(str); |
||||
|
str = strGreeceDiscode(str); |
||||
|
str = strcharacterDiscode(str); |
||||
|
str = strOtherDiscode(str); |
||||
|
str = strMoreDiscode(str); |
||||
|
return str; |
||||
|
} |
||||
|
function urlToHttpUrl(url,rep){ |
||||
|
|
||||
|
var patt1 = new RegExp("^//"); |
||||
|
var result = patt1.test(url); |
||||
|
if(result){ |
||||
|
url = rep+":"+url; |
||||
|
} |
||||
|
return url; |
||||
|
} |
||||
|
|
||||
|
module.exports = { |
||||
|
strDiscode:strDiscode, |
||||
|
urlToHttpUrl:urlToHttpUrl |
||||
|
} |
||||
@ -0,0 +1,159 @@ |
|||||
|
/** |
||||
|
* author: Di (微信小程序开发工程师) |
||||
|
* organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com)
|
||||
|
* 垂直微信小程序开发交流社区 |
||||
|
* |
||||
|
* github地址: https://github.com/icindy/wxParse
|
||||
|
* |
||||
|
* for: 微信小程序富文本解析 |
||||
|
* detail : http://weappdev.com/t/wxparse-alpha0-1-html-markdown/184
|
||||
|
*/ |
||||
|
|
||||
|
/** |
||||
|
* utils函数引入 |
||||
|
**/ |
||||
|
import showdown from './showdown.js'; |
||||
|
import HtmlToJson from './html2json.js'; |
||||
|
/** |
||||
|
* 配置及公有属性 |
||||
|
**/ |
||||
|
var realWindowWidth = 0; |
||||
|
var realWindowHeight = 0; |
||||
|
wx.getSystemInfo({ |
||||
|
success: function (res) { |
||||
|
realWindowWidth = res.windowWidth |
||||
|
realWindowHeight = res.windowHeight |
||||
|
} |
||||
|
}) |
||||
|
/** |
||||
|
* 主函数入口区 |
||||
|
**/ |
||||
|
function wxParse(bindName = 'wxParseData', type='html', data='<div class="color:red;">数据不能为空</div>', target,imagePadding) { |
||||
|
var that = target; |
||||
|
var transData = {};//存放转化后的数据
|
||||
|
if (type == 'html') { |
||||
|
transData = HtmlToJson.html2json(data, bindName); |
||||
|
console.log(JSON.stringify(transData, ' ', ' ')); |
||||
|
} else if (type == 'md' || type == 'markdown') { |
||||
|
var converter = new showdown.Converter(); |
||||
|
var html = converter.makeHtml(data); |
||||
|
transData = HtmlToJson.html2json(html, bindName); |
||||
|
console.log(JSON.stringify(transData, ' ', ' ')); |
||||
|
} |
||||
|
transData.view = {}; |
||||
|
transData.view.imagePadding = 0; |
||||
|
if(typeof(imagePadding) != 'undefined'){ |
||||
|
transData.view.imagePadding = imagePadding |
||||
|
} |
||||
|
var bindData = {}; |
||||
|
bindData[bindName] = transData; |
||||
|
that.setData(bindData) |
||||
|
that.wxParseImgLoad = wxParseImgLoad; |
||||
|
that.wxParseImgTap = wxParseImgTap; |
||||
|
} |
||||
|
// 图片点击事件
|
||||
|
function wxParseImgTap(e) { |
||||
|
var that = this; |
||||
|
var nowImgUrl = e.target.dataset.src; |
||||
|
var tagFrom = e.target.dataset.from; |
||||
|
if (typeof (tagFrom) != 'undefined' && tagFrom.length > 0) { |
||||
|
wx.previewImage({ |
||||
|
current: nowImgUrl, // 当前显示图片的http链接
|
||||
|
urls: that.data[tagFrom].imageUrls // 需要预览的图片http链接列表
|
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* 图片视觉宽高计算函数区 |
||||
|
**/ |
||||
|
function wxParseImgLoad(e) { |
||||
|
var that = this; |
||||
|
var tagFrom = e.target.dataset.from; |
||||
|
var idx = e.target.dataset.idx; |
||||
|
if (typeof (tagFrom) != 'undefined' && tagFrom.length > 0) { |
||||
|
calMoreImageInfo(e, idx, that, tagFrom) |
||||
|
} |
||||
|
} |
||||
|
// 假循环获取计算图片视觉最佳宽高
|
||||
|
function calMoreImageInfo(e, idx, that, bindName) { |
||||
|
var temData = that.data[bindName]; |
||||
|
if (!temData || temData.images.length == 0) { |
||||
|
return; |
||||
|
} |
||||
|
var temImages = temData.images; |
||||
|
//因为无法获取view宽度 需要自定义padding进行计算，稍后处理
|
||||
|
var recal = wxAutoImageCal(e.detail.width, e.detail.height,that,bindName); |
||||
|
// temImages[idx].width = recal.imageWidth;
|
||||
|
// temImages[idx].height = recal.imageheight;
|
||||
|
// temData.images = temImages;
|
||||
|
// var bindData = {};
|
||||
|
// bindData[bindName] = temData;
|
||||
|
// that.setData(bindData);
|
||||
|
var index = temImages[idx].index |
||||
|
var key = `${bindName}` |
||||
|
for (var i of index.split('.')) key+=`.nodes[${i}]` |
||||
|
var keyW = key + '.width' |
||||
|
var keyH = key + '.height' |
||||
|
that.setData({ |
||||
|
[keyW]: recal.imageWidth, |
||||
|
[keyH]: recal.imageheight, |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
// 计算视觉优先的图片宽高
|
||||
|
function wxAutoImageCal(originalWidth, originalHeight,that,bindName) { |
||||
|
//获取图片的原始长宽
|
||||
|
var windowWidth = 0, windowHeight = 0; |
||||
|
var autoWidth = 0, autoHeight = 0; |
||||
|
var results = {}; |
||||
|
var padding = that.data[bindName].view.imagePadding; |
||||
|
windowWidth = realWindowWidth-2*padding; |
||||
|
windowHeight = realWindowHeight; |
||||
|
//判断按照那种方式进行缩放
|
||||
|
// console.log("windowWidth" + windowWidth);
|
||||
|
if (originalWidth > windowWidth) {//在图片width大于手机屏幕width时候
|
||||
|
autoWidth = windowWidth; |
||||
|
// console.log("autoWidth" + autoWidth);
|
||||
|
autoHeight = (autoWidth * originalHeight) / originalWidth; |
||||
|
// console.log("autoHeight" + autoHeight);
|
||||
|
results.imageWidth = autoWidth; |
||||
|
results.imageheight = autoHeight; |
||||
|
} else {//否则展示原来的数据
|
||||
|
results.imageWidth = originalWidth; |
||||
|
results.imageheight = originalHeight; |
||||
|
} |
||||
|
return results; |
||||
|
} |
||||
|
|
||||
|
function wxParseTemArray(temArrayName,bindNameReg,total,that){ |
||||
|
var array = []; |
||||
|
var temData = that.data; |
||||
|
var obj = null; |
||||
|
for(var i = 0; i < total; i++){ |
||||
|
var simArr = temData[bindNameReg+i].nodes; |
||||
|
array.push(simArr); |
||||
|
} |
||||
|
|
||||
|
temArrayName = temArrayName || 'wxParseTemArray'; |
||||
|
obj = JSON.parse('{"'+ temArrayName +'":""}'); |
||||
|
obj[temArrayName] = array; |
||||
|
that.setData(obj); |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* 配置emojis |
||||
|
* |
||||
|
*/ |
||||
|
|
||||
|
function emojisInit(reg='',baseSrc="/wxParse/emojis/",emojis){ |
||||
|
HtmlToJson.emojisInit(reg,baseSrc,emojis); |
||||
|
} |
||||
|
|
||||
|
module.exports = { |
||||
|
wxParse: wxParse, |
||||
|
wxParseTemArray:wxParseTemArray, |
||||
|
emojisInit:emojisInit |
||||
|
} |
||||
|
|
||||
|
|
||||
@ -0,0 +1,967 @@ |
|||||
|
<!--** |
||||
|
* author: Di (微信小程序开发工程师) |
||||
|
* organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com) |
||||
|
* 垂直微信小程序开发交流社区 |
||||
|
* |
||||
|
* github地址: https://github.com/icindy/wxParse |
||||
|
* |
||||
|
* for: 微信小程序富文本解析 |
||||
|
* detail : http://weappdev.com/t/wxparse-alpha0-1-html-markdown/184 |
||||
|
*/--> |
||||
|
|
||||
|
<!--基础元素--> |
||||
|
<template name="wxParseVideo"> |
||||
|
<!--增加video标签支持，并循环添加--> |
||||
|
<view class="{{item.classStr}} wxParse-{{item.tag}}" style="{{item.styleStr}}"> |
||||
|
<video class="{{item.classStr}} wxParse-{{item.tag}}-video" src="{{item.attr.src}}"></video> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<template name="wxParseImg"> |
||||
|
<image class="{{item.classStr}} wxParse-{{item.tag}}" data-from="{{item.from}}" data-src="{{item.attr.src}}" data-idx="{{item.imgIndex}}" src="{{item.attr.src}}" mode="aspectFit" bindload="wxParseImgLoad" bindtap="wxParseImgTap" mode="widthFix" style="width:{{item.width}}px;" |
||||
|
/> |
||||
|
</template> |
||||
|
|
||||
|
<template name="WxEmojiView"> |
||||
|
<view class="WxEmojiView wxParse-inline" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.textArray}}" wx:key=""> |
||||
|
<block class="{{item.text == '\\n' ? 'wxParse-hide':''}}" wx:if="{{item.node == 'text'}}">{{item.text}}</block> |
||||
|
<block wx:elif="{{item.node == 'element'}}"> |
||||
|
<image class="wxEmoji" src="{{item.baseSrc}}{{item.text}}" /> |
||||
|
</block> |
||||
|
</block> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<template name="WxParseBr"> |
||||
|
<text>\n</text> |
||||
|
</template> |
||||
|
<!--入口模版--> |
||||
|
|
||||
|
<template name="wxParse"> |
||||
|
<block wx:for="{{wxParseData}}" wx:key=""> |
||||
|
<template is="wxParse0" data="{{item}}" /> |
||||
|
</block> |
||||
|
</template> |
||||
|
|
||||
|
|
||||
|
<!--循环模版--> |
||||
|
<template name="wxParse0"> |
||||
|
<!--<template is="wxParse1" data="{{item}}" />--> |
||||
|
<!--判断是否是标签节点--> |
||||
|
<block wx:if="{{item.node == 'element'}}"> |
||||
|
<block wx:if="{{item.tag == 'button'}}"> |
||||
|
<button type="default" size="mini"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse1" data="{{item}}" /> |
||||
|
</block> |
||||
|
</button> |
||||
|
</block> |
||||
|
<!--li类型--> |
||||
|
<block wx:elif="{{item.tag == 'li'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li" style="{{item.styleStr}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li-inner"> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<view class="{{item.classStr}} wxParse-li-circle"></view> |
||||
|
</view> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse1" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--video类型--> |
||||
|
<block wx:elif="{{item.tag == 'video'}}"> |
||||
|
<template is="wxParseVideo" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--img类型--> |
||||
|
<block wx:elif="{{item.tag == 'img'}}"> |
||||
|
<template is="wxParseImg" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--a类型--> |
||||
|
<block wx:elif="{{item.tag == 'a'}}"> |
||||
|
<view bindtap="wxParseTagATap" class="wxParse-inline {{item.classStr}} wxParse-{{item.tag}}" data-src="{{item.attr.href}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse1" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
<block wx:elif="{{item.tag == 'table'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-{{item.tag}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse1" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<block wx:elif="{{item.tag == 'br'}}"> |
||||
|
<template is="WxParseBr"></template> |
||||
|
</block> |
||||
|
<!--其他块级标签--> |
||||
|
<block wx:elif="{{item.tagType == 'block'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-{{item.tag}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse1" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--内联标签--> |
||||
|
<view wx:else class="{{item.classStr}} wxParse-{{item.tag}} wxParse-{{item.tagType}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse1" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
|
||||
|
</block> |
||||
|
|
||||
|
<!--判断是否是文本节点--> |
||||
|
<block wx:elif="{{item.node == 'text'}}"> |
||||
|
<!--如果是，直接进行--> |
||||
|
<template is="WxEmojiView" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
</template> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<!--循环模版--> |
||||
|
<template name="wxParse1"> |
||||
|
<!--<template is="wxParse2" data="{{item}}" />--> |
||||
|
<!--判断是否是标签节点--> |
||||
|
<block wx:if="{{item.node == 'element'}}"> |
||||
|
<block wx:if="{{item.tag == 'button'}}"> |
||||
|
<button type="default" size="mini"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse2" data="{{item}}" /> |
||||
|
</block> |
||||
|
</button> |
||||
|
</block> |
||||
|
<!--li类型--> |
||||
|
<block wx:elif="{{item.tag == 'li'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li" style="{{item.styleStr}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li-inner"> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<view class="{{item.classStr}} wxParse-li-circle"></view> |
||||
|
</view> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse2" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--video类型--> |
||||
|
<block wx:elif="{{item.tag == 'video'}}"> |
||||
|
<template is="wxParseVideo" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--img类型--> |
||||
|
<block wx:elif="{{item.tag == 'img'}}"> |
||||
|
<template is="wxParseImg" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--a类型--> |
||||
|
<block wx:elif="{{item.tag == 'a'}}"> |
||||
|
<view bindtap="wxParseTagATap" class="wxParse-inline {{item.classStr}} wxParse-{{item.tag}}" data-src="{{item.attr.href}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse2" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<block wx:elif="{{item.tag == 'br'}}"> |
||||
|
<template is="WxParseBr"></template> |
||||
|
</block> |
||||
|
<!--其他块级标签--> |
||||
|
<block wx:elif="{{item.tagType == 'block'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-{{item.tag}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse2" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--内联标签--> |
||||
|
<view wx:else class="{{item.classStr}} wxParse-{{item.tag}} wxParse-{{item.tagType}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse2" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
|
||||
|
</block> |
||||
|
|
||||
|
<!--判断是否是文本节点--> |
||||
|
<block wx:elif="{{item.node == 'text'}}"> |
||||
|
<!--如果是，直接进行--> |
||||
|
<template is="WxEmojiView" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
</template> |
||||
|
|
||||
|
|
||||
|
<!--循环模版--> |
||||
|
<template name="wxParse2"> |
||||
|
<!--<template is="wxParse3" data="{{item}}" />--> |
||||
|
<!--判断是否是标签节点--> |
||||
|
<block wx:if="{{item.node == 'element'}}"> |
||||
|
<block wx:if="{{item.tag == 'button'}}"> |
||||
|
<button type="default" size="mini"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse3" data="{{item}}" /> |
||||
|
</block> |
||||
|
</button> |
||||
|
</block> |
||||
|
<!--li类型--> |
||||
|
<block wx:elif="{{item.tag == 'li'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li" style="{{item.styleStr}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li-inner"> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<view class="{{item.classStr}} wxParse-li-circle"></view> |
||||
|
</view> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse3" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--video类型--> |
||||
|
<block wx:elif="{{item.tag == 'video'}}"> |
||||
|
<template is="wxParseVideo" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--img类型--> |
||||
|
<block wx:elif="{{item.tag == 'img'}}"> |
||||
|
<template is="wxParseImg" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--a类型--> |
||||
|
<block wx:elif="{{item.tag == 'a'}}"> |
||||
|
<view bindtap="wxParseTagATap" class="wxParse-inline {{item.classStr}} wxParse-{{item.tag}}" data-src="{{item.attr.href}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse3" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<block wx:elif="{{item.tag == 'br'}}"> |
||||
|
<template is="WxParseBr"></template> |
||||
|
</block> |
||||
|
<!--其他块级标签--> |
||||
|
<block wx:elif="{{item.tagType == 'block'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-{{item.tag}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse3" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--内联标签--> |
||||
|
<view wx:else class="{{item.classStr}} wxParse-{{item.tag}} wxParse-{{item.tagType}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse3" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
|
||||
|
</block> |
||||
|
|
||||
|
<!--判断是否是文本节点--> |
||||
|
<block wx:elif="{{item.node == 'text'}}"> |
||||
|
<!--如果是，直接进行--> |
||||
|
<template is="WxEmojiView" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
</template> |
||||
|
|
||||
|
<!--循环模版--> |
||||
|
<template name="wxParse3"> |
||||
|
<!--<template is="wxParse4" data="{{item}}" />--> |
||||
|
<!--判断是否是标签节点--> |
||||
|
<block wx:if="{{item.node == 'element'}}"> |
||||
|
<block wx:if="{{item.tag == 'button'}}"> |
||||
|
<button type="default" size="mini"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse4" data="{{item}}" /> |
||||
|
</block> |
||||
|
</button> |
||||
|
</block> |
||||
|
<!--li类型--> |
||||
|
<block wx:elif="{{item.tag == 'li'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li" style="{{item.styleStr}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li-inner"> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<view class="{{item.classStr}} wxParse-li-circle"></view> |
||||
|
</view> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse4" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--video类型--> |
||||
|
<block wx:elif="{{item.tag == 'video'}}"> |
||||
|
<template is="wxParseVideo" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--img类型--> |
||||
|
<block wx:elif="{{item.tag == 'img'}}"> |
||||
|
<template is="wxParseImg" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--a类型--> |
||||
|
<block wx:elif="{{item.tag == 'a'}}"> |
||||
|
<view bindtap="wxParseTagATap" class="wxParse-inline {{item.classStr}} wxParse-{{item.tag}}" data-src="{{item.attr.href}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse4" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<block wx:elif="{{item.tag == 'br'}}"> |
||||
|
<template is="WxParseBr"></template> |
||||
|
</block> |
||||
|
<!--其他块级标签--> |
||||
|
<block wx:elif="{{item.tagType == 'block'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-{{item.tag}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse4" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--内联标签--> |
||||
|
<view wx:else class="{{item.classStr}} wxParse-{{item.tag}} wxParse-{{item.tagType}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse4" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
|
||||
|
</block> |
||||
|
|
||||
|
<!--判断是否是文本节点--> |
||||
|
<block wx:elif="{{item.node == 'text'}}"> |
||||
|
<!--如果是，直接进行--> |
||||
|
<template is="WxEmojiView" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
</template> |
||||
|
|
||||
|
<!--循环模版--> |
||||
|
<template name="wxParse4"> |
||||
|
<!--<template is="wxParse5" data="{{item}}" />--> |
||||
|
<!--判断是否是标签节点--> |
||||
|
<block wx:if="{{item.node == 'element'}}"> |
||||
|
<block wx:if="{{item.tag == 'button'}}"> |
||||
|
<button type="default" size="mini"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse5" data="{{item}}" /> |
||||
|
</block> |
||||
|
</button> |
||||
|
</block> |
||||
|
<!--li类型--> |
||||
|
<block wx:elif="{{item.tag == 'li'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li" style="{{item.styleStr}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li-inner"> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<view class="{{item.classStr}} wxParse-li-circle"></view> |
||||
|
</view> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse5" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--video类型--> |
||||
|
<block wx:elif="{{item.tag == 'video'}}"> |
||||
|
<template is="wxParseVideo" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--img类型--> |
||||
|
<block wx:elif="{{item.tag == 'img'}}"> |
||||
|
<template is="wxParseImg" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--a类型--> |
||||
|
<block wx:elif="{{item.tag == 'a'}}"> |
||||
|
<view bindtap="wxParseTagATap" class="wxParse-inline {{item.classStr}} wxParse-{{item.tag}}" data-src="{{item.attr.href}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse5" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<block wx:elif="{{item.tag == 'br'}}"> |
||||
|
<template is="WxParseBr"></template> |
||||
|
</block> |
||||
|
<!--其他块级标签--> |
||||
|
<block wx:elif="{{item.tagType == 'block'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-{{item.tag}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse5" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--内联标签--> |
||||
|
<view wx:else class="{{item.classStr}} wxParse-{{item.tag}} wxParse-{{item.tagType}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse5" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
|
||||
|
</block> |
||||
|
|
||||
|
<!--判断是否是文本节点--> |
||||
|
<block wx:elif="{{item.node == 'text'}}"> |
||||
|
<!--如果是，直接进行--> |
||||
|
<template is="WxEmojiView" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
</template> |
||||
|
|
||||
|
<!--循环模版--> |
||||
|
<template name="wxParse5"> |
||||
|
<!--<template is="wxParse6" data="{{item}}" />--> |
||||
|
<!--判断是否是标签节点--> |
||||
|
<block wx:if="{{item.node == 'element'}}"> |
||||
|
<block wx:if="{{item.tag == 'button'}}"> |
||||
|
<button type="default" size="mini"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse6" data="{{item}}" /> |
||||
|
</block> |
||||
|
</button> |
||||
|
</block> |
||||
|
<!--li类型--> |
||||
|
<block wx:elif="{{item.tag == 'li'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li" style="{{item.styleStr}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li-inner"> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<view class="{{item.classStr}} wxParse-li-circle"></view> |
||||
|
</view> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse6" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--video类型--> |
||||
|
<block wx:elif="{{item.tag == 'video'}}"> |
||||
|
<template is="wxParseVideo" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--img类型--> |
||||
|
<block wx:elif="{{item.tag == 'img'}}"> |
||||
|
<template is="wxParseImg" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--a类型--> |
||||
|
<block wx:elif="{{item.tag == 'a'}}"> |
||||
|
<view bindtap="wxParseTagATap" class="wxParse-inline {{item.classStr}} wxParse-{{item.tag}}" data-src="{{item.attr.href}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse6" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<block wx:elif="{{item.tag == 'br'}}"> |
||||
|
<template is="WxParseBr"></template> |
||||
|
</block> |
||||
|
<!--其他块级标签--> |
||||
|
<block wx:elif="{{item.tagType == 'block'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-{{item.tag}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse6" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--内联标签--> |
||||
|
<view wx:else class="{{item.classStr}} wxParse-{{item.tag}} wxParse-{{item.tagType}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse6" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
|
||||
|
</block> |
||||
|
|
||||
|
<!--判断是否是文本节点--> |
||||
|
<block wx:elif="{{item.node == 'text'}}"> |
||||
|
<!--如果是，直接进行--> |
||||
|
<template is="WxEmojiView" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
</template> |
||||
|
|
||||
|
<!--循环模版--> |
||||
|
<template name="wxParse6"> |
||||
|
<!--<template is="wxParse7" data="{{item}}" />--> |
||||
|
<!--判断是否是标签节点--> |
||||
|
<block wx:if="{{item.node == 'element'}}"> |
||||
|
<block wx:if="{{item.tag == 'button'}}"> |
||||
|
<button type="default" size="mini"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse7" data="{{item}}" /> |
||||
|
</block> |
||||
|
</button> |
||||
|
</block> |
||||
|
<!--li类型--> |
||||
|
<block wx:elif="{{item.tag == 'li'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li" style="{{item.styleStr}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li-inner"> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<view class="{{item.classStr}} wxParse-li-circle"></view> |
||||
|
</view> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse7" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--video类型--> |
||||
|
<block wx:elif="{{item.tag == 'video'}}"> |
||||
|
<template is="wxParseVideo" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--img类型--> |
||||
|
<block wx:elif="{{item.tag == 'img'}}"> |
||||
|
<template is="wxParseImg" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--a类型--> |
||||
|
<block wx:elif="{{item.tag == 'a'}}"> |
||||
|
<view bindtap="wxParseTagATap" class="wxParse-inline {{item.classStr}} wxParse-{{item.tag}}" data-src="{{item.attr.href}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse7" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<block wx:elif="{{item.tag == 'br'}}"> |
||||
|
<template is="WxParseBr"></template> |
||||
|
</block> |
||||
|
<!--其他块级标签--> |
||||
|
<block wx:elif="{{item.tagType == 'block'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-{{item.tag}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse7" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--内联标签--> |
||||
|
<view wx:else class="{{item.classStr}} wxParse-{{item.tag}} wxParse-{{item.tagType}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse7" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
|
||||
|
</block> |
||||
|
|
||||
|
<!--判断是否是文本节点--> |
||||
|
<block wx:elif="{{item.node == 'text'}}"> |
||||
|
<!--如果是，直接进行--> |
||||
|
<template is="WxEmojiView" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
</template> |
||||
|
<!--循环模版--> |
||||
|
<template name="wxParse7"> |
||||
|
<!--<template is="wxParse8" data="{{item}}" />--> |
||||
|
<!--判断是否是标签节点--> |
||||
|
<block wx:if="{{item.node == 'element'}}"> |
||||
|
<block wx:if="{{item.tag == 'button'}}"> |
||||
|
<button type="default" size="mini"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse8" data="{{item}}" /> |
||||
|
</block> |
||||
|
</button> |
||||
|
</block> |
||||
|
<!--li类型--> |
||||
|
<block wx:elif="{{item.tag == 'li'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li" style="{{item.styleStr}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li-inner"> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<view class="{{item.classStr}} wxParse-li-circle"></view> |
||||
|
</view> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse8" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--video类型--> |
||||
|
<block wx:elif="{{item.tag == 'video'}}"> |
||||
|
<template is="wxParseVideo" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--img类型--> |
||||
|
<block wx:elif="{{item.tag == 'img'}}"> |
||||
|
<template is="wxParseImg" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--a类型--> |
||||
|
<block wx:elif="{{item.tag == 'a'}}"> |
||||
|
<view bindtap="wxParseTagATap" class="wxParse-inline {{item.classStr}} wxParse-{{item.tag}}" data-src="{{item.attr.href}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse8" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<block wx:elif="{{item.tag == 'br'}}"> |
||||
|
<template is="WxParseBr"></template> |
||||
|
</block> |
||||
|
<!--其他块级标签--> |
||||
|
<block wx:elif="{{item.tagType == 'block'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-{{item.tag}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse8" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--内联标签--> |
||||
|
<view wx:else class="{{item.classStr}} wxParse-{{item.tag}} wxParse-{{item.tagType}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse8" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
|
||||
|
</block> |
||||
|
|
||||
|
<!--判断是否是文本节点--> |
||||
|
<block wx:elif="{{item.node == 'text'}}"> |
||||
|
<!--如果是，直接进行--> |
||||
|
<template is="WxEmojiView" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
</template> |
||||
|
|
||||
|
<!--循环模版--> |
||||
|
<template name="wxParse8"> |
||||
|
<!--<template is="wxParse9" data="{{item}}" />--> |
||||
|
<!--判断是否是标签节点--> |
||||
|
<block wx:if="{{item.node == 'element'}}"> |
||||
|
<block wx:if="{{item.tag == 'button'}}"> |
||||
|
<button type="default" size="mini"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse9" data="{{item}}" /> |
||||
|
</block> |
||||
|
</button> |
||||
|
</block> |
||||
|
<!--li类型--> |
||||
|
<block wx:elif="{{item.tag == 'li'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li" style="{{item.styleStr}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li-inner"> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<view class="{{item.classStr}} wxParse-li-circle"></view> |
||||
|
</view> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse9" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--video类型--> |
||||
|
<block wx:elif="{{item.tag == 'video'}}"> |
||||
|
<template is="wxParseVideo" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--img类型--> |
||||
|
<block wx:elif="{{item.tag == 'img'}}"> |
||||
|
<template is="wxParseImg" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--a类型--> |
||||
|
<block wx:elif="{{item.tag == 'a'}}"> |
||||
|
<view bindtap="wxParseTagATap" class="wxParse-inline {{item.classStr}} wxParse-{{item.tag}}" data-src="{{item.attr.href}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse9" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<block wx:elif="{{item.tag == 'br'}}"> |
||||
|
<template is="WxParseBr"></template> |
||||
|
</block> |
||||
|
<!--其他块级标签--> |
||||
|
<block wx:elif="{{item.tagType == 'block'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-{{item.tag}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse9" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--内联标签--> |
||||
|
<view wx:else class="{{item.classStr}} wxParse-{{item.tag}} wxParse-{{item.tagType}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse9" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
|
||||
|
</block> |
||||
|
|
||||
|
<!--判断是否是文本节点--> |
||||
|
<block wx:elif="{{item.node == 'text'}}"> |
||||
|
<!--如果是，直接进行--> |
||||
|
<template is="WxEmojiView" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
</template> |
||||
|
|
||||
|
<!--循环模版--> |
||||
|
<template name="wxParse9"> |
||||
|
<!--<template is="wxParse10" data="{{item}}" />--> |
||||
|
<!--判断是否是标签节点--> |
||||
|
<block wx:if="{{item.node == 'element'}}"> |
||||
|
<block wx:if="{{item.tag == 'button'}}"> |
||||
|
<button type="default" size="mini"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse10" data="{{item}}" /> |
||||
|
</block> |
||||
|
</button> |
||||
|
</block> |
||||
|
<!--li类型--> |
||||
|
<block wx:elif="{{item.tag == 'li'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li" style="{{item.styleStr}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li-inner"> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<view class="{{item.classStr}} wxParse-li-circle"></view> |
||||
|
</view> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse10" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--video类型--> |
||||
|
<block wx:elif="{{item.tag == 'video'}}"> |
||||
|
<template is="wxParseVideo" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--img类型--> |
||||
|
<block wx:elif="{{item.tag == 'img'}}"> |
||||
|
<template is="wxParseImg" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--a类型--> |
||||
|
<block wx:elif="{{item.tag == 'a'}}"> |
||||
|
<view bindtap="wxParseTagATap" class="wxParse-inline {{item.classStr}} wxParse-{{item.tag}}" data-src="{{item.attr.href}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse10" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<block wx:elif="{{item.tag == 'br'}}"> |
||||
|
<template is="WxParseBr"></template> |
||||
|
</block> |
||||
|
<!--其他块级标签--> |
||||
|
<block wx:elif="{{item.tagType == 'block'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-{{item.tag}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse10" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--内联标签--> |
||||
|
<view wx:else class="{{item.classStr}} wxParse-{{item.tag}} wxParse-{{item.tagType}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse10" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
|
||||
|
</block> |
||||
|
|
||||
|
<!--判断是否是文本节点--> |
||||
|
<block wx:elif="{{item.node == 'text'}}"> |
||||
|
<!--如果是，直接进行--> |
||||
|
<template is="WxEmojiView" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
</template> |
||||
|
|
||||
|
<!--循环模版--> |
||||
|
<template name="wxParse10"> |
||||
|
<!--<template is="wxParse11" data="{{item}}" />--> |
||||
|
<!--判断是否是标签节点--> |
||||
|
<block wx:if="{{item.node == 'element'}}"> |
||||
|
<block wx:if="{{item.tag == 'button'}}"> |
||||
|
<button type="default" size="mini"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse11" data="{{item}}" /> |
||||
|
</block> |
||||
|
</button> |
||||
|
</block> |
||||
|
<!--li类型--> |
||||
|
<block wx:elif="{{item.tag == 'li'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li" style="{{item.styleStr}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li-inner"> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<view class="{{item.classStr}} wxParse-li-circle"></view> |
||||
|
</view> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse11" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--video类型--> |
||||
|
<block wx:elif="{{item.tag == 'video'}}"> |
||||
|
<template is="wxParseVideo" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--img类型--> |
||||
|
<block wx:elif="{{item.tag == 'img'}}"> |
||||
|
<template is="wxParseImg" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--a类型--> |
||||
|
<block wx:elif="{{item.tag == 'a'}}"> |
||||
|
<view bindtap="wxParseTagATap" class="wxParse-inline {{item.classStr}} wxParse-{{item.tag}}" data-src="{{item.attr.href}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse11" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<block wx:elif="{{item.tag == 'br'}}"> |
||||
|
<template is="WxParseBr"></template> |
||||
|
</block> |
||||
|
<!--其他块级标签--> |
||||
|
<block wx:elif="{{item.tagType == 'block'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-{{item.tag}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse11" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--内联标签--> |
||||
|
<view wx:else class="{{item.classStr}} wxParse-{{item.tag}} wxParse-{{item.tagType}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse11" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
|
||||
|
</block> |
||||
|
|
||||
|
<!--判断是否是文本节点--> |
||||
|
<block wx:elif="{{item.node == 'text'}}"> |
||||
|
<!--如果是，直接进行--> |
||||
|
<template is="WxEmojiView" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
</template> |
||||
|
|
||||
|
<!--循环模版--> |
||||
|
<template name="wxParse11"> |
||||
|
<!--<template is="wxParse12" data="{{item}}" />--> |
||||
|
<!--判断是否是标签节点--> |
||||
|
<block wx:if="{{item.node == 'element'}}"> |
||||
|
<block wx:if="{{item.tag == 'button'}}"> |
||||
|
<button type="default" size="mini"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse12" data="{{item}}" /> |
||||
|
</block> |
||||
|
</button> |
||||
|
</block> |
||||
|
<!--li类型--> |
||||
|
<block wx:elif="{{item.tag == 'li'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li" style="{{item.styleStr}}"> |
||||
|
<view class="{{item.classStr}} wxParse-li-inner"> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<view class="{{item.classStr}} wxParse-li-circle"></view> |
||||
|
</view> |
||||
|
<view class="{{item.classStr}} wxParse-li-text"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse12" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--video类型--> |
||||
|
<block wx:elif="{{item.tag == 'video'}}"> |
||||
|
<template is="wxParseVideo" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--img类型--> |
||||
|
<block wx:elif="{{item.tag == 'img'}}"> |
||||
|
<template is="wxParseImg" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
<!--a类型--> |
||||
|
<block wx:elif="{{item.tag == 'a'}}"> |
||||
|
<view bindtap="wxParseTagATap" class="wxParse-inline {{item.classStr}} wxParse-{{item.tag}}" data-src="{{item.attr.href}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse12" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<block wx:elif="{{item.tag == 'br'}}"> |
||||
|
<template is="WxParseBr"></template> |
||||
|
</block> |
||||
|
<!--其他块级标签--> |
||||
|
<block wx:elif="{{item.tagType == 'block'}}"> |
||||
|
<view class="{{item.classStr}} wxParse-{{item.tag}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse12" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<!--内联标签--> |
||||
|
<view wx:else class="{{item.classStr}} wxParse-{{item.tag}} wxParse-{{item.tagType}}" style="{{item.styleStr}}"> |
||||
|
<block wx:for="{{item.nodes}}" wx:for-item="item" wx:key=""> |
||||
|
<template is="wxParse12" data="{{item}}" /> |
||||
|
</block> |
||||
|
</view> |
||||
|
|
||||
|
</block> |
||||
|
|
||||
|
<!--判断是否是文本节点--> |
||||
|
<block wx:elif="{{item.node == 'text'}}"> |
||||
|
<!--如果是，直接进行--> |
||||
|
<template is="WxEmojiView" data="{{item}}" /> |
||||
|
</block> |
||||
|
|
||||
|
</template> |
||||
@ -0,0 +1,206 @@ |
|||||
|
|
||||
|
/** |
||||
|
* author: Di (微信小程序开发工程师) |
||||
|
* organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com) |
||||
|
* 垂直微信小程序开发交流社区 |
||||
|
* |
||||
|
* github地址: https://github.com/icindy/wxParse |
||||
|
* |
||||
|
* for: 微信小程序富文本解析 |
||||
|
* detail : http://weappdev.com/t/wxparse-alpha0-1-html-markdown/184 |
||||
|
*/ |
||||
|
|
||||
|
.wxParse{ |
||||
|
margin: 0 5px; |
||||
|
font-family: Helvetica,sans-serif; |
||||
|
font-size: 28rpx; |
||||
|
color: #666; |
||||
|
line-height: 1.8; |
||||
|
} |
||||
|
view{ |
||||
|
word-break:break-all; overflow:auto; |
||||
|
} |
||||
|
.wxParse-inline{ |
||||
|
display: inline; |
||||
|
margin: 0; |
||||
|
padding: 0; |
||||
|
} |
||||
|
/*//标题 */ |
||||
|
.wxParse-div{margin: 0;padding: 0;} |
||||
|
.wxParse-h1{ font-size:2em; margin: .67em 0 } |
||||
|
.wxParse-h2{ font-size:1.5em; margin: .75em 0 } |
||||
|
.wxParse-h3{ font-size:1.17em; margin: .83em 0 } |
||||
|
.wxParse-h4{ margin: 1.12em 0} |
||||
|
.wxParse-h5 { font-size:.83em; margin: 1.5em 0 } |
||||
|
.wxParse-h6{ font-size:.75em; margin: 1.67em 0 } |
||||
|
|
||||
|
.wxParse-h1 { |
||||
|
font-size: 18px; |
||||
|
font-weight: 400; |
||||
|
margin-bottom: .9em; |
||||
|
} |
||||
|
.wxParse-h2 { |
||||
|
font-size: 16px; |
||||
|
font-weight: 400; |
||||
|
margin-bottom: .34em; |
||||
|
} |
||||
|
.wxParse-h3 { |
||||
|
font-weight: 400; |
||||
|
font-size: 15px; |
||||
|
margin-bottom: .34em; |
||||
|
} |
||||
|
.wxParse-h4 { |
||||
|
font-weight: 400; |
||||
|
font-size: 14px; |
||||
|
margin-bottom: .24em; |
||||
|
} |
||||
|
.wxParse-h5 { |
||||
|
font-weight: 400; |
||||
|
font-size: 13px; |
||||
|
margin-bottom: .14em; |
||||
|
} |
||||
|
.wxParse-h6 { |
||||
|
font-weight: 400; |
||||
|
font-size: 12px; |
||||
|
margin-bottom: .04em; |
||||
|
} |
||||
|
|
||||
|
.wxParse-h1, .wxParse-h2, .wxParse-h3, .wxParse-h4, .wxParse-h5, .wxParse-h6, .wxParse-b, .wxParse-strong { font-weight: bolder } |
||||
|
|
||||
|
.wxParse-i,.wxParse-cite,.wxParse-em,.wxParse-var,.wxParse-address{font-style:italic} |
||||
|
.wxParse-pre,.wxParse-tt,.wxParse-code,.wxParse-kbd,.wxParse-samp{font-family:monospace} |
||||
|
.wxParse-pre{white-space:pre} |
||||
|
.wxParse-big{font-size:1.17em} |
||||
|
.wxParse-small,.wxParse-sub,.wxParse-sup{font-size:.83em} |
||||
|
.wxParse-sub{vertical-align:sub} |
||||
|
.wxParse-sup{vertical-align:super} |
||||
|
.wxParse-s,.wxParse-strike,.wxParse-del{text-decoration:line-through} |
||||
|
/*wxparse-自定义个性化的css样式*/ |
||||
|
/*增加video的css样式*/ |
||||
|
.wxParse-strong,.wxParse-s{display: inline} |
||||
|
.wxParse-a{ |
||||
|
color: deepskyblue; |
||||
|
word-break:break-all; |
||||
|
overflow:auto; |
||||
|
} |
||||
|
|
||||
|
.wxParse-video{ |
||||
|
text-align: center; |
||||
|
margin: 10px 0; |
||||
|
} |
||||
|
|
||||
|
.wxParse-video-video{ |
||||
|
width:100%; |
||||
|
} |
||||
|
|
||||
|
.wxParse-img{ |
||||
|
/*background-color: #efefef;*/ |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
|
||||
|
.wxParse-blockquote { |
||||
|
margin: 0; |
||||
|
padding:10px 0 10px 5px; |
||||
|
font-family:Courier, Calibri,"宋体"; |
||||
|
background:#f5f5f5; |
||||
|
border-left: 3px solid #dbdbdb; |
||||
|
} |
||||
|
|
||||
|
.wxParse-code,.wxParse-wxxxcode-style{ |
||||
|
display: inline; |
||||
|
background:#f5f5f5; |
||||
|
} |
||||
|
.wxParse-ul{ |
||||
|
margin: 20rpx 10rpx; |
||||
|
} |
||||
|
|
||||
|
.wxParse-li,.wxParse-li-inner{ |
||||
|
display: flex; |
||||
|
align-items: baseline; |
||||
|
margin: 10rpx 0; |
||||
|
} |
||||
|
.wxParse-li-text{ |
||||
|
|
||||
|
align-items: center; |
||||
|
line-height: 20px; |
||||
|
} |
||||
|
|
||||
|
.wxParse-li-circle{ |
||||
|
display: inline-flex; |
||||
|
width: 5px; |
||||
|
height: 5px; |
||||
|
background-color: #333; |
||||
|
margin-right: 5px; |
||||
|
} |
||||
|
|
||||
|
.wxParse-li-square{ |
||||
|
display: inline-flex; |
||||
|
width: 10rpx; |
||||
|
height: 10rpx; |
||||
|
background-color: #333; |
||||
|
margin-right: 5px; |
||||
|
} |
||||
|
.wxParse-li-ring{ |
||||
|
display: inline-flex; |
||||
|
width: 10rpx; |
||||
|
height: 10rpx; |
||||
|
border: 2rpx solid #333; |
||||
|
border-radius: 50%; |
||||
|
background-color: #fff; |
||||
|
margin-right: 5px; |
||||
|
} |
||||
|
|
||||
|
/*.wxParse-table{ |
||||
|
width: 100%; |
||||
|
height: 400px; |
||||
|
} |
||||
|
.wxParse-thead,.wxParse-tfoot,.wxParse-tr{ |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
} |
||||
|
.wxParse-th,.wxParse-td{ |
||||
|
display: flex; |
||||
|
width: 580px; |
||||
|
overflow: auto; |
||||
|
}*/ |
||||
|
|
||||
|
.wxParse-u { |
||||
|
text-decoration: underline; |
||||
|
} |
||||
|
.wxParse-hide{ |
||||
|
display: none; |
||||
|
} |
||||
|
.WxEmojiView{ |
||||
|
align-items: center; |
||||
|
} |
||||
|
.wxEmoji{ |
||||
|
width: 16px; |
||||
|
height:16px; |
||||
|
} |
||||
|
.wxParse-tr{ |
||||
|
display: flex; |
||||
|
border-right:1px solid #e0e0e0; |
||||
|
border-bottom:1px solid #e0e0e0; |
||||
|
border-top:1px solid #e0e0e0; |
||||
|
} |
||||
|
.wxParse-th, |
||||
|
.wxParse-td{ |
||||
|
flex:1; |
||||
|
padding:5px; |
||||
|
font-size:28rpx; |
||||
|
border-left:1px solid #e0e0e0; |
||||
|
word-break: break-all; |
||||
|
} |
||||
|
.wxParse-td:last{ |
||||
|
border-top:1px solid #e0e0e0; |
||||
|
} |
||||
|
.wxParse-th{ |
||||
|
background:#f0f0f0; |
||||
|
border-top:1px solid #e0e0e0; |
||||
|
} |
||||
|
.wxParse-del{ |
||||
|
display: inline; |
||||
|
} |
||||
|
.wxParse-figure { |
||||
|
overflow: hidden; |
||||
|
} |
||||
Loading…
Reference in new issue