資訊專(zhuān)欄INFORMATION COLUMN
摘要：雖然可以通過(guò)谷歌賬號(hào)同步書(shū)簽，但是因?yàn)榭偹苤脑?，存在諸多不便。具體步驟在書(shū)簽管理器頁(yè)面導(dǎo)出格式書(shū)簽由于導(dǎo)出的格式存在許多未閉合的標(biāo)簽，為方便之后的操作，使用打開(kāi)書(shū)簽文件會(huì)自動(dòng)補(bǔ)齊標(biāo)簽，調(diào)用開(kāi)發(fā)者工具，將復(fù)制保存使用解析書(shū)簽文件。
平時(shí)在PC上積累了不少Chrome書(shū)簽，一直希望能在其他地方使用，但在導(dǎo)出到其它瀏覽器，尤其是手機(jī)瀏覽器的時(shí)候遇到不少困難。雖然可以通過(guò)谷歌賬號(hào)同步書(shū)簽，但是因?yàn)榭偹苤脑?，存在諸多不便。于是寫(xiě)了個(gè)小程序，將chrome的html書(shū)簽解析成json格式，方便拓展使用。
具體步驟在chrome書(shū)簽管理器頁(yè)面導(dǎo)出html格式書(shū)簽；
由于導(dǎo)出的html格式存在許多未閉合的標(biāo)簽，為方便之后的操作，使用chrome打開(kāi)書(shū)簽html文件；
chrome會(huì)自動(dòng)補(bǔ)齊標(biāo)簽，調(diào)用開(kāi)發(fā)者工具，將html復(fù)制保存；
使用NodeJS解析書(shū)簽html文件。
html書(shū)簽補(bǔ)齊前書(shū)簽是這樣的，DT標(biāo)簽，p標(biāo)簽都未閉合
補(bǔ)齊標(biāo)簽后的html
使用cheerio來(lái)執(zhí)行dom操作，執(zhí)行步驟
首先，讀取補(bǔ)齊后的html書(shū)簽；
獲得最外層dt元素
從最外層dt元素開(kāi)始遍歷dom樹(shù)，其中h3標(biāo)簽為文件夾名稱(chēng)，A標(biāo)簽包含書(shū)簽名稱(chēng)、書(shū)簽地址等信息；
將書(shū)簽和文件夾存儲(chǔ)為對(duì)象，同一文件夾下的書(shū)簽和文件夾對(duì)象的集合存儲(chǔ)為數(shù)組；
將最終的對(duì)象轉(zhuǎn)化為json字符串，存儲(chǔ)到j(luò)son文件
var cheerio = require("cheerio"),
fs = require("fs");
// 讀取書(shū)簽html文件
fs.readFile("bookmarks.html", "utf-8",function(err,data){
if(err){
console.log("error");
}else{
parse(data);
}
});
function parse(html){
// 加載html，使用常用的$符號(hào)
var $ = cheerio.load(html);
// 獲取最外層的dt標(biāo)簽
var $dl = $("dl").first();
var $dt = $dl.children("dt").eq(0);
// 從dt開(kāi)始遍歷dom樹(shù)，生成對(duì)象
var obj = foo($dt);
// 將對(duì)象轉(zhuǎn)化為json字符串，添加額外參數(shù)使json格式更易閱讀
var s = JSON.stringify(obj, null, 4);
// 將json字符串寫(xiě)入json文件
fs.writeFileSync("output.json", s);
function foo($dt){
// h3標(biāo)簽為文件夾名稱(chēng)
var $h3 = $dt.children("h3");
if($h3.length == 0){
// a標(biāo)簽為網(wǎng)址
var $a = $dt.children("a");
// 返回該書(shū)簽的名稱(chēng)和網(wǎng)址組成的對(duì)象
return $a.length > 0 ? {"name": $a.text(),"href": $a.attr("href")} : null;
}
var h3 = $h3.text();
var arr = [];
var obj = {};
// 獲取下一級(jí)dt標(biāo)簽集合
var $dl = $dt.children("dl");
var $dtArr = $dl.children("dt");
for(var i = 0; i < $dtArr.length; i++){
// 遍歷下一級(jí)dt標(biāo)簽
var tmp = foo($dtArr.eq(i));
// 將返回的對(duì)象push至子文件數(shù)組
arr.push(tmp);
}
// 創(chuàng)建文件夾與子文件數(shù)組的鍵值對(duì)
obj[h3] = arr;
// 返回該對(duì)象
return obj;
}
}
json文件
{
"書(shū)簽欄": [
{
"name": "GitHub",
"href": "https://github.com/"
},
{
"name": "RequireJS 中文網(wǎng)",
"href": "http://www.requirejs.cn/home.html"
},
{
"name": "(2 封私信 / 99+ 條消息) 首頁(yè) - 知乎",
"href": "https://www.zhihu.com/"
},
{
"name": "慕課網(wǎng)(IMOOC)-國(guó)內(nèi)最大的IT技能學(xué)習(xí)平臺(tái)",
"href": "http://www.imooc.com/"
}
]
}
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/80766.html
摘要：前言一直混跡社區(qū)突然發(fā)現(xiàn)自己收藏了不少好文但是管理起來(lái)有點(diǎn)混亂所以將前端主流技術(shù)做了一個(gè)書(shū)簽整理不求最多最全但求最實(shí)用。 前言 一直混跡社區(qū),突然發(fā)現(xiàn)自己收藏了不少好文但是管理起來(lái)有點(diǎn)混亂; 所以將前端主流技術(shù)做了一個(gè)書(shū)簽整理,不求最多最全,但求最實(shí)用。 書(shū)簽源碼 書(shū)簽導(dǎo)入瀏覽器效果截圖showImg(https://segmentfault.com/img/bVbg41b?w=107...
摘要：項(xiàng)目概述糖果盒子是采用開(kāi)發(fā)的站點(diǎn)導(dǎo)航應(yīng)用，專(zhuān)注分享優(yōu)質(zhì)開(kāi)發(fā)資源站點(diǎn)，希望成為開(kāi)發(fā)人員最喜愛(ài)的的書(shū)簽導(dǎo)航。線上地址糖果盒子開(kāi)發(fā)者的書(shū)簽導(dǎo)航地址求環(huán)境要求部署安裝本項(xiàng)目代碼使用框架開(kāi)發(fā)，本地開(kāi)發(fā)環(huán)境使用。 showImg(https://segmentfault.com/img/remote/1460000012018405?w=3346&h=1950);showImg(https://s...
摘要：項(xiàng)目概述糖果盒子是采用開(kāi)發(fā)的站點(diǎn)導(dǎo)航應(yīng)用，專(zhuān)注分享優(yōu)質(zhì)開(kāi)發(fā)資源站點(diǎn)，希望成為開(kāi)發(fā)人員最喜愛(ài)的的書(shū)簽導(dǎo)航。線上地址糖果盒子開(kāi)發(fā)者的書(shū)簽導(dǎo)航地址求環(huán)境要求部署安裝本項(xiàng)目代碼使用框架開(kāi)發(fā)，本地開(kāi)發(fā)環(huán)境使用。 showImg(https://segmentfault.com/img/remote/1460000012018405?w=3346&h=1950);showImg(https://s...
摘要：項(xiàng)目概述糖果盒子是采用開(kāi)發(fā)的站點(diǎn)導(dǎo)航應(yīng)用，專(zhuān)注分享優(yōu)質(zhì)開(kāi)發(fā)資源站點(diǎn)，希望成為開(kāi)發(fā)人員最喜愛(ài)的的書(shū)簽導(dǎo)航。線上地址糖果盒子開(kāi)發(fā)者的書(shū)簽導(dǎo)航地址求環(huán)境要求部署安裝本項(xiàng)目代碼使用框架開(kāi)發(fā)，本地開(kāi)發(fā)環(huán)境使用。 showImg(https://segmentfault.com/img/remote/1460000012018405?w=3346&h=1950);showImg(https://s...
閱讀 2108·2021-11-15 17:57
閱讀 789·2021-11-11 16:54
閱讀 2633·2021-09-27 13:58
閱讀 4220·2021-09-06 15:00
閱讀 990·2021-09-04 16:45
閱讀 3541·2019-08-30 15:56
閱讀 1810·2019-08-30 15:53
閱讀 1686·2019-08-30 14:12
