使用NodeJS解析chrome書簽

李昌杰發布于2019-08-20 12:03 / 3235人閱讀

摘要：雖然可以通過谷歌賬號同步書簽，但是因為總所周知的原因，存在諸多不便。具體步驟在書簽管理器頁面導出格式書簽由于導出的格式存在許多未閉合的標簽，為方便之后的操作，使用打開書簽文件會自動補齊標簽，調用開發者工具，將復制保存使用解析書簽文件。

平時在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/"
        } 
    ]
}

GPU云服務器云服務器使用需要nodejs nodejs使用jquery nodejs_session使用網絡書簽

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/80766.html

前端最實用書簽(持續更新)

摘要：前言一直混跡社區突然發現自己收藏了不少好文但是管理起來有點混亂所以將前端主流技術做了一個書簽整理不求最多最全但求最實用。前言一直混跡社區,突然發現自己收藏了不少好文但是管理起來有點混亂; 所以將前端主流技術做了一個書簽整理,不求最多最全,但求最實用。書簽源碼書簽導入瀏覽器效果截圖showImg(https://segmentfault.com/img/bVbg41b?w=107...

sshe 2019-08-23 12:00 評論0 收藏0
Laravel 開源項目『糖果盒子 - Web 開發者的書簽導航』

摘要：項目概述糖果盒子是采用開發的站點導航應用，專注分享優質開發資源站點，希望成為開發人員最喜愛的的書簽導航。線上地址糖果盒子開發者的書簽導航地址求環境要求部署安裝本項目代碼使用框架開發，本地開發環境使用。 showImg(https://segmentfault.com/img/remote/1460000012018405?w=3346&h=1950);showImg(https://s...

姘存按 2019-08-21 17:39 評論0 收藏0
Laravel 開源項目『糖果盒子 - Web 開發者的書簽導航』

摘要：項目概述糖果盒子是采用開發的站點導航應用，專注分享優質開發資源站點，希望成為開發人員最喜愛的的書簽導航。線上地址糖果盒子開發者的書簽導航地址求環境要求部署安裝本項目代碼使用框架開發，本地開發環境使用。 showImg(https://segmentfault.com/img/remote/1460000012018405?w=3346&h=1950);showImg(https://s...

summerpxy 2019-08-01 18:00 評論0 收藏0
Laravel 開源項目『糖果盒子 - Web 開發者的書簽導航』

摘要：項目概述糖果盒子是采用開發的站點導航應用，專注分享優質開發資源站點，希望成為開發人員最喜愛的的書簽導航。線上地址糖果盒子開發者的書簽導航地址求環境要求部署安裝本項目代碼使用框架開發，本地開發環境使用。 showImg(https://segmentfault.com/img/remote/1460000012018405?w=3346&h=1950);showImg(https://s...

CntChen 2019-06-28 14:18 評論0 收藏0