输出小程序支持的html格式

README.md

@@ -1,64 +1,80 @@
 # html-parser
 Simple HTML to JSON parser use Regexp and String.indexOf
 
-## Install
-
-```shell
-npm install htmlstr-parser
-
+## Update
+微信建议nodes属性绑定数组，所以htmlParse(html)返回值改成数组
+旧版本输出属性名根据微信文档改变,微信文档地址： https://mp.weixin.qq.com/debug/wxadoc/dev/component/rich-text.html
 ```
+"tag":"root" => "name": "div"
+"type": "Element" || "Text" => type: "node" || "text"
+"attributes": {} => attrs: {"class": "parse-*"} // 增加默认class（parse-div,parse-img, parse-a...），可外部修改转换后元素的样式
+"content": "content..." => "text": "text..." // 文本节点内容
+```
+
 ## Basic usage
 
 ```javascript
+import htmlParser from "htmlParser"
+data: {
+ nodes: []
+}
 
 var html = "<div style='height:10rpx;width: 20rpx;'>1<p>2<br/><a href='http://www.baidu.com'>3</a></p><p>2</p></div>"
-htmlParser(html)
+this.setData({
+  nodes: htmlParser(this.data.html)
+})
 
+```
+wxml:
+```wxml
+<rich-text class="rich-text" nodes="{{nodes}}"></rich-text>
 ```
 ### Output
 ```javascript
 
-{
-  "tag": "root",
+[{
+  "name": "div",
   "children": [{
-    "type": "Element",
-    "tagName": "div",
-    "attributes": {
+    "type": "node",
+    "name": "div",
+    "attrs": {
+      "class": "parse-div",
       "style": "height:10rpx;width: 20rpx;"
     },
     "children": [{
-      "type": "Text",
-      "content": "1"
+      "type": "text",
+      "text": "1"
     }, {
-      "type": "Element",
-      "tagName": "p",
-      "attributes": {},
+      "type": "node",
+      "name": "p",
+      "attrs": {"class": "parse-p"},
       "children": [{
-        "type": "Text",
-        "content": "2"
+        "type": "text",
+        "text": "2"
       }, {
-        "type": "Element",
-        "tagName": "br"
+        "type": "node",
+        "name": "br"
       }, {
-        "type": "Element",
-        "tagName": "a",
-        "attributes": {
+        "type": "node",
+        "name": "a",
+        "attrs": {
+	  "class": "parse-a",
           "href": "http://www.baidu.com"
         },
         "children": [{
-          "type": "Text",
-          "content": "3"
+          "type": "text",
+          "text": "3"
         }]
       }]
     }, {
-      "type": "Element",
-      "tagName": "p",
-      "attributes": {},
+      "type": "node",
+      "name": "p",
+      "attrs": {"class": "parse-p"},
       "children": [{
-        "type": "Text",
-        "content": "2"
+        "type": "text",
+        "text": "2"
       }]
     }]
   }]
-}
+}]
 ```

src/parser/index.js

@@ -3,7 +3,7 @@ import { ElEMENT_TYPE, TEXT_TYPE, createNodeFactory } from './nodes'
 
 export function parse(tokens) {
   let root = {
-    tag: "root",
+    name: "div",
     children: []
   }
   let tagArray = [root]
@@ -32,5 +32,5 @@ export function parse(tokens) {
     }
   }
 
-  return root
+  return tagArray
 }

src/parser/nodes.js

@@ -1,31 +1,36 @@
 import { TagEmpty } from '../tokenizer/types'
 
-export const ElEMENT_TYPE = "Element"
-export const TEXT_TYPE = "Text"
+export const ElEMENT_TYPE = "node"
+export const TEXT_TYPE = "text"
 
 function createElement(token){
-  const tagName = token.name
-  const attributes = token.attributes
+  const name = token.name
+  const attrs = token.attrs
+  if(attrs['class']){
+    attrs['class'] += ' parse-' + name
+  } else {
+    attrs['class'] = ' parse-' + name
+  }
   if (token instanceof TagEmpty) {
     return {
       type: ElEMENT_TYPE,
-      tagName,
-      attributes
+      name,
+      attrs
     }
   }
   return {
     type: ElEMENT_TYPE,
-    tagName,
-    attributes,
+    name,
+    attrs,
     children: []
   }
 }
 
 function createText(token){
-  const content = token.text
+  const text = token.text
   return {
     type: TEXT_TYPE,
-    content
+    text
   }
 }
 

src/tokenizer/types.js

@@ -4,7 +4,7 @@ import { isFillattrsMaker } from './makers'
 export class TagStart {
   constructor(name, tag){
     this.name = name
-    this.attributes = this.getAttributes(tag)
+    this.attrs = this.getAttributes(tag)
   }
   getAttributes(str) {
     let attrsMap = {}