资讯专栏INFORMATION COLUMN

使用NodeJS解析chrome书签

李昌杰 / 3106人阅读

摘要:虽然可以通过谷歌账号同步书签,但是因为总所周知的原因,存在诸多不便。具体步骤在书签管理器页面导出格式书签由于导出的格式存在许多未闭合的标签,为方便之后的操作,使用打开书签文件会自动补齐标签,调用开发者工具,将复制保存使用解析书签文件。

平时在PC上积累了不少Chrome书签,一直希望能在其他地方使用,但在导出到其它浏览器,尤其是手机浏览器的时候遇到不少困难。虽然可以通过谷歌账号同步书签,但是因为总所周知的原因,存在诸多不便。于是写了个小程序,将chrome的html书签解析成json格式,方便拓展使用。

具体步骤

在chrome书签管理器页面导出html格式书签;

由于导出的html格式存在许多未闭合的标签,为方便之后的操作,使用chrome打开书签html文件;

chrome会自动补齐标签,调用开发者工具,将html复制保存;

使用NodeJS解析书签html文件。

html书签

补齐前书签是这样的,DT标签,p标签都未闭合

书签栏

GitHub

补齐标签后的html

书签栏

GitHub

NodeJS程序

使用cheerio来执行dom操作,执行步骤

首先,读取补齐后的html书签;

获得最外层dt元素

从最外层dt元素开始遍历dom树,其中h3标签为文件夹名称,A标签包含书签名称、书签地址等信息;

将书签和文件夹存储为对象,同一文件夹下的书签和文件夹对象的集合存储为数组;

将最终的对象转化为json字符串,存储到json文件

var cheerio = require("cheerio"),
    fs = require("fs");

// 读取书签html文件
fs.readFile("bookmarks.html", "utf-8",function(err,data){
    if(err){
        console.log("error");
    }else{
        parse(data);
    }
});

function parse(html){

    // 加载html,使用常用的$符号
    var $ = cheerio.load(html);

    // 获取最外层的dt标签
    var $dl = $("dl").first();
    var $dt = $dl.children("dt").eq(0);

    // 从dt开始遍历dom树,生成对象
    var obj = foo($dt);

    // 将对象转化为json字符串,添加额外参数使json格式更易阅读
    var s = JSON.stringify(obj, null, 4);

    // 将json字符串写入json文件
    fs.writeFileSync("output.json", s);

    function foo($dt){

        // h3标签为文件夹名称
        var $h3 = $dt.children("h3");

        if($h3.length == 0){

            // a标签为网址
            var $a = $dt.children("a");

            // 返回该书签的名称和网址组成的对象
            return $a.length > 0 ? {"name": $a.text(),"href": $a.attr("href")} : null;
        }

        var h3 = $h3.text();
        var arr = [];
        var obj = {};

        // 获取下一级dt标签集合
        var $dl = $dt.children("dl");
        var $dtArr = $dl.children("dt");
        for(var i = 0; i < $dtArr.length; i++){

            // 遍历下一级dt标签
            var tmp = foo($dtArr.eq(i));

            // 将返回的对象push至子文件数组
            arr.push(tmp);
        }

        // 创建文件夹与子文件数组的键值对
        obj[h3] = arr;

        // 返回该对象
        return obj;
    }
}
json文件
{
    "书签栏": [
        {
            "name": "GitHub",
            "href": "https://github.com/"
        },
                {
            "name": "RequireJS 中文网",
            "href": "http://www.requirejs.cn/home.html"
        },
        {
            "name": "(2 封私信 / 99+ 条消息) 首页 - 知乎",
            "href": "https://www.zhihu.com/"
        },
        {
            "name": "慕课网(IMOOC)-国内最大的IT技能学习平台",
            "href": "http://www.imooc.com/"
        } 
    ]
}    

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/80766.html

相关文章

  • 前端最实用书签(持续更新)

    摘要:前言一直混迹社区突然发现自己收藏了不少好文但是管理起来有点混乱所以将前端主流技术做了一个书签整理不求最多最全但求最实用。 前言 一直混迹社区,突然发现自己收藏了不少好文但是管理起来有点混乱; 所以将前端主流技术做了一个书签整理,不求最多最全,但求最实用。 书签源码 书签导入浏览器效果截图showImg(https://segmentfault.com/img/bVbg41b?w=107...

    sshe 评论0 收藏0
  • Laravel 开源项目 『 糖果盒子 - Web 开发者的书签导航 』

    摘要:项目概述糖果盒子是采用开发的站点导航应用,专注分享优质开发资源站点,希望成为开发人员最喜爱的的书签导航。线上地址糖果盒子开发者的书签导航地址求环境要求部署安装本项目代码使用框架开发,本地开发环境使用。 showImg(https://segmentfault.com/img/remote/1460000012018405?w=3346&h=1950);showImg(https://s...

    姘存按 评论0 收藏0
  • Laravel 开源项目 『 糖果盒子 - Web 开发者的书签导航 』

    摘要:项目概述糖果盒子是采用开发的站点导航应用,专注分享优质开发资源站点,希望成为开发人员最喜爱的的书签导航。线上地址糖果盒子开发者的书签导航地址求环境要求部署安装本项目代码使用框架开发,本地开发环境使用。 showImg(https://segmentfault.com/img/remote/1460000012018405?w=3346&h=1950);showImg(https://s...

    summerpxy 评论0 收藏0
  • Laravel 开源项目 『 糖果盒子 - Web 开发者的书签导航 』

    摘要:项目概述糖果盒子是采用开发的站点导航应用,专注分享优质开发资源站点,希望成为开发人员最喜爱的的书签导航。线上地址糖果盒子开发者的书签导航地址求环境要求部署安装本项目代码使用框架开发,本地开发环境使用。 showImg(https://segmentfault.com/img/remote/1460000012018405?w=3346&h=1950);showImg(https://s...

    GraphQuery 评论0 收藏0
  • Laravel 开源项目 『 糖果盒子 - Web 开发者的书签导航 』

    摘要:项目概述糖果盒子是采用开发的站点导航应用,专注分享优质开发资源站点,希望成为开发人员最喜爱的的书签导航。线上地址糖果盒子开发者的书签导航地址求环境要求部署安装本项目代码使用框架开发,本地开发环境使用。 showImg(https://segmentfault.com/img/remote/1460000012018405?w=3346&h=1950);showImg(https://s...

    CntChen 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<