parse-html-template
TypeScript icon, indicating that this package has built-in type declarations

0.0.20 • Public • Published

简介

解析html/template,生成token树,记录节点数据;

支持:元素节点文本节点注释节点

实例:

`<div data-angular name="angular"
      &style="{width: dataWidth}"
      @change="go($event,'query')">
	子元素:【文本】
    <div style="width: 100px;height: 100px;background-color:#e5e0e1;" 
         &style="{width: dataWidth}"  
         &name="block" 
         @click="emit($event,123)">
    </div>
</div>
<p class="forP bindClass2"
   &class="{bindClass1: class1,bindClass2: class2}">
    我是:{{exp}},{{exp2}}
</p>
<app-child></app-child>
<!-- 注释信息-->`

使用:

let Parser = new parseHTML();
Parser.parse(htmlString);

parse逻辑

0. <                    // 节点|文本
    0.1. <!--           // 注释
    0.2. <nodeName      // 节点
    0.3. </             // 闭合节点
	0.4. 文本
1. 其他                  // 文本

元素节点

{
	tagName: "div"
	type: 1,
    attributes: 
    	['data-angular', 
    	 'name', '=', 'angular', 
         '&style','=', '{width: dataWidth}', 
         '@change', '=', "go($event,'query')"],
	children:[],
	startPosition:{},
	endPosition:{}
}

文本节点

{
	content: "子元素:【文本】"
	type: 3,
    parent:{},
	startPosition:{},
	endPosition:{}
}

注释节点

{
	content: "子元素:【文本】"
	type: 8,
	startPosition:{},
	endPosition:{}
}

Package Sidebar

Install

npm i parse-html-template

Weekly Downloads

2

Version

0.0.20

License

ISC

Unpacked Size

66 kB

Total Files

8

Last publish

Collaborators

  • cuibingbing