加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
文件
克隆/下载
xhtmlToJson.js 4.04 KB
一键复制 编辑 原始数据 按行查看 历史
/*!
* 🔪 - 解析xhtml为json对象返回
* https://github.com/hai2007/algorithm.js/blob/master/xhtmlToJson.js
*
* author hai2007 < https://hai2007.gitee.io/sweethome >
*
* Copyright (c) 2020-present hai2007 走一步,再走一步。
* Released under the MIT license
*/
import $RegExp from './.inner/RegExp';
import { isString } from '@hai2007/tool/type';
import nextTagFun from './.inner/xhtmlToJson/nextTag';
import analyseDeep from '././.inner/xhtmlToJson/analyseDeep';
// 获取一棵DOM树
// noIgnore为true表示不忽略任何标签
export default function (template, noIgnore) {
if (!isString(template)) throw new Error("Template must be a String!");
// 获取读取下一个标签对象
var nextTag = nextTagFun(template.trim());
var tag = nextTag(), DomTree = [];
while (tag != null) {
if (tag.type == 'textcode' && $RegExp.blanksReg.test(tag.tagName)) {
// 空白文本结点过滤掉
} else if (tag.type == 'DOCTYPE') {
// DOCTYPE过滤掉
} else if (tag.type == 'comment') {
// 注释目前也默认过滤掉,除非显示声明不忽略
if (noIgnore) {
DomTree.push(tag);
}
} else {
DomTree.push(tag);
}
tag = nextTag();
}
// 分析层次
DomTree = analyseDeep(DomTree);
/**
* 模仿浏览器构建的一棵树,每个结点有如下属性:
*
* 1.parentNode index 父结点
* 2.childNodes [] 孩子结点
* 3.preNode index 前一个兄弟结点
* 4.nextNode index 后一个兄弟结点
*
* 5.attrs:{} 当前结点的属性
* 6.name 节点名称
* 7.type 节点类型(tag和text)
* 8.content 文本结点内容
*
* 需要注意的是:如果一个文本结点内容只包含回车,tab,空格等空白字符,会直接被忽视
*/
var presNode = [null], preDeep = 0;
for (var i = 0; i < DomTree.length; i++) {
// 当前结点
var currentIndex = i, currentDeep = DomTree[i].__deep__;
DomTree[i].childNodes = [];
DomTree[i].preNode = null;
DomTree[i].nextNode = null;
// 前置三个结点
var lastPre = presNode[presNode.length - 1];
var last2Pre = presNode.length > 1 ? presNode[presNode.length - 2] : null;
// 如果遇到的是兄弟结点
if (currentDeep == preDeep) {
// 修改兄弟关系
DomTree[currentIndex].preNode = lastPre;
DomTree[lastPre].nextNode = currentIndex;
// 修改父子关系
DomTree[currentIndex].parentNode = last2Pre;
DomTree[last2Pre].childNodes.push(currentIndex);
// 校对presNode
presNode[presNode.length - 1] = currentIndex;
}
// 如果是遇到了孩子
else if (currentDeep > preDeep) {
// 修改兄弟关系
// todo
// 修改父子关系
DomTree[currentIndex].parentNode = lastPre;
if (lastPre != null) DomTree[lastPre].childNodes.push(currentIndex);
// 校对presNode
presNode.push(currentIndex);
}
// 如果是遇到了祖先
else {
var preTempIndex = presNode[presNode.length - 1 - (preDeep - currentDeep)];
var preTemp2Index = presNode[presNode.length - 2 - (preDeep - currentDeep)];
// 修改兄弟关系
DomTree[currentIndex].preNode = preTempIndex;
if (preTempIndex != null) DomTree[preTempIndex].nextNode = currentIndex;
// 修改父子关系
DomTree[currentIndex].parentNode = preTemp2Index;
if (preTemp2Index != null) DomTree[preTemp2Index].childNodes.push(currentIndex);
// 校对presNode
for (var j = 0; j < preDeep - currentDeep; j++) { presNode.pop(); }
presNode[presNode.length - 1] = currentIndex;
}
preDeep = currentDeep;
}
return DomTree;
};
Loading...
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化