Chrome扩展开发总结之浏览器书签获取_且听真言的博客-CSDN博客_bookmark
Chrome扩展开发总结之浏览器书签获取
且听真言
于 2018-09-03 11:28:13 发布
4210
收藏
11
分类专栏：
Chrome插件开发
Chrome插件开发
文章标签：
Chrome扩展
Chrome扩展获取浏览器书签
Chrome API获取浏览器书签
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zhangying1994/article/details/82346353
版权
Chrome插件开发
同时被 2 个专栏收录
2 篇文章
0 订阅
订阅专栏
Chrome插件开发
4 篇文章
0 订阅
订阅专栏
前段时间公司要求调研了插件开发，现在做一些总结。
功能1：通过Chrome插件获取浏览器的书签。
要在扩展中操作书签，需要在Manifest中声明bookmarks权限：
"permissions": [     "bookmarks" ]
以下是获取用户完整书签的方法
chrome.bookmarks.getTree(function(bookmarkArray){     console.log(bookmarkArray); });
下图是通过getTree方法获取的完整的Chrome浏览器书签结构。
"children":[
"children":[
"dateAdded":1533195221974,
"id":"29",
"index":0,
"parentId":"1",
"title":"Bookmarks",
"url":"chrome://bookmarks/"
},
"dateAdded":1504833760729,
"id":"6",
"index":1,
"parentId":"1",
"title":"System Dashboard - GOME JIRA",
"url":"http://192.168.59.239:8090/secure/Dashboard.jspa"
},
"dateAdded":1504851054302,
"id":"10",
"index":2,
"parentId":"1",
"title":"360导航_新一代安全上网导航",
"url":"https://hao.360.cn/?src=lm&ls=n3287fc1193"
},
"dateAdded":1507861175200,
"id":"13",
"index":3,
"parentId":"1",
"title":"gerrit.iuv.com:8080/login/%2Fdashboard%2Fself",
"url":"http://gerrit.iuv.com:8080/login/%2Fdashboard%2Fself"
},
"dateAdded":1510391708075,
"id":"17",
"index":4,
"parentId":"1",
"title":"新标签页",
"url":"chrome://newtab/"
},
"children":[
"dateAdded":1504833785831,
"id":"7",
"index":0,
"parentId":"22",
"title":"GM2.0代码提交",
"url":"http://192.168.63.219:8080/#/dashboard/self"
},
"dateAdded":1510391652467,
"id":"16",
"index":1,
"parentId":"22",
"title":"GM12B代码提交",
"url":"http://gerrit.iuv.com:8080/dashboard/self"
},
"dateAdded":1523150901878,
"id":"25",
"index":2,
"parentId":"22",
"title":"NanJing Code Review 217",
"url":"http://192.168.63.217:8080/#/dashboard/self"
},
"dateAdded":1525059849667,
"id":"27",
"index":3,
"parentId":"22",
"title":"Wiki",
"url":"http://wiki.iuv.com:8090/spaces/viewspace.action?key=IUV"
],
"dateAdded":1519300604409,
"dateGroupModified":1525059849667,
"id":"22",
"index":5,
"parentId":"1",
"title":"代码提交"
},
"children":[
"dateAdded":1519300582881,
"id":"21",
"index":0,
"parentId":"23",
"title":"专利检索及分析",
"url":"http://www.pss-system.gov.cn/sipopublicsearch/portal/uiIndex.shtml"
},
"dateAdded":1519300549982,
"id":"20",
"index":1,
"parentId":"23",
"title":"佰腾网",
"url":"http://www.baiten.cn/"
],
"dateAdded":1519300686945,
"dateGroupModified":1523150901878,
"id":"23",
"index":6,
"parentId":"1",
"title":"专利"
},
"dateAdded":1533195225452,
"id":"30",
"index":7,
"parentId":"1",
"title":"扩展程序",
"url":"chrome://extensions/"
},
"dateAdded":1534917074926,
"id":"32",
"index":8,
"parentId":"1",
"title":"Animate.css",
"url":"https://daneden.github.io/animate.css/"
],
"dateAdded":1504833743697,
"dateGroupModified":1534917074926,
"id":"1",
"index":0,
"parentId":"0",
"title":"书签栏"
},
"children":[
],
"dateAdded":1504833743697,
"id":"2",
"index":1,
"parentId":"0",
"title":"其他书签"
],
"dateAdded":1535934493104,
"id":"0",
"title":""
以下是解析该书签结构的方法：需求是需要获取每个书签的url以及这个书签的完整路径。
function analyseBookMark (data, bookmarkArray, path) {    for (var children in data) {        if (data[children].length > 0 && typeof(data[children]) == "object") {            if (data && data.title && data.title !== '') {                path = path + data.title + '/';            }            analyseBookMark(data[children], bookmarkArray, path);        } else {            if (typeof(data[children]) == "object") {                for(var childKey in data[children]) {                    if (typeof(data[children][childKey]) == "object") {                        if (data && data[children].title && data[children].title !== '') {                            path = path + data[children].title + '/';                        }                        analyseBookMark(data[children][childKey], bookmarkArray, path);                    } else {                        if (childKey === "url") {                            var url = data[children][childKey];                            var title = data[children].title;                            var path = path;                            var jsonData = {                                title: title,                                url: url,                                path: path                            };                            bookmarkArray.push(jsonData);                        }                    }                }            } else {                if (children === "url") {                    var url = data[children];                    var title = data.title;                    var path = path;                    var jsonData = {                        title: title,                        url: url,                        path: path                    };                    bookmarkArray.push(jsonData);                }            }        }    } };
且听真言
关注
关注
点赞
11
收藏
打赏
评论
Chrome扩展开发总结之浏览器书签获取
前段时间公司要求调研了插件开发，现在做一些总结。  功能1：通过Chrome插件获取浏览器的书签。要在扩展中操作书签，需要在Manifest中声明bookmarks权限："permissions": [    "bookmarks"]以下是获取用户完整书签的方法chrome.bookmarks.getTree(function(bookmarkArray){   ...
复制链接
扫一扫
专栏目录
Chrome获取书签插件工程文件（提取）
03-11
文件类型为zip格式，不可以直接导入；
文件提取自Chrome开源书签插件并进行了精简，仅供学习使用。
读取Chrome书签文件
weixin_30745553的博客
12-11
211
使用C#读取Chrome浏览器的本地书签文件，当前文件在C盘下用户文件夹\AppData\Local\Google\Chrome\User Data\Default\下的Bookmarks
打开这个文件我们发现就是一个json文本文件
"checksum": "e723a57c9d9cbcae27ce0e1f8a5b7e71",
"roots": {
"b...
评论 1
您还未登录，请先
登录
后发表或查看评论
chrome的扩展中调用书签的API
aini_zlr2008的博客
02-24
449
chrome的扩展中怎么调用书签的API?
1，chrome.bookmarks.getTree(function callback)
Retrieves the entire Bookmarks hierarchy.
Parameters
callback ( function )
Callback function
The callback parameter should...
浏览器插件官方demo学习（一）：基本代码、页面渲染、书签、cookie、Omnibox等
最新发布
weixin_41897680的博客
10-16
205
浏览器插件官方demo学习（一）：基本代码、页面渲染、书签、cookie、Omnibox等
主要是官方提供的v3例子：Hello World、Page Redder、My Bookmarks、Chromium Milestones、Cookie Clearer、Omnibox - New Tab Search、Web Accessible Resources
Chrome浏览器扩展开发系列之十六：扩展中可用的Chrome浏览器API
weixin_30278237的博客
10-12
466
除了Chrome浏览器支持的chrome.* API之外，Chrome浏览器扩展还可以使用Chrome浏览器为Web页面或Chrome app提供的APIs。对于Chrome浏览器2支持的API，还可以绑定第三方API库到Chrome浏览器扩展程序。
Chrome浏览器扩展程序可以使用的API包括：
标准JavaScript API，即Web应用中常用的JavaScript核心API和DO...
Chrome插件开发学习心得（四）之修改浏览器菜单
二哈的欢乐世界
02-21
3301
浏览器鼠标点击的触发事件除了工具栏以外，最为方便的就是右击菜单栏了。同时，Chrome浏览器插件开发也有关于修改菜单栏的API。
在iOS设备上如何使用Chrome浏览器的书签
yisago的博客
05-17
1754
核心提示：谷歌Chrome浏览器iOS版正式登陆AppStore。不过有很多人安装以后没有找到书签工具，以为没有。其实不然。iOS设备上的Chrome浏览器是内置有书签工具的，和Safari相比，不是很明显。只有搭配相应的App时，才能体现出强大的功能。
谷歌Chrome浏览器iOS版正式登陆AppStore。不过有很多人安装以后没有找到书签工具，以为没有。其实不然。iOS设备上的Chrome浏览器是内置有书签工具的，和Safari相比，不是很明显。只有搭配相应的App时，才能体现出强大的功能。
下面让我们
Chrome书签插件，让你实现高效整理
m0_69916115的博客
08-01
884
现在是网络时代，我们可以在网络中获取到各种学习的资源，以及我们想要学习的知识，在接触到新的事物或是知识的时候，我们也会通过在网络搜索来进行一些基础的了解，相信很多人在使用浏览器的时候，都会发现很多对自己有用的文件或是自己感兴趣的一些图片和知识等，这些东西我们都会直接保存在浏览器收藏夹中，这样就会导致我们的收藏夹变得很混乱，并且在我们需要找东西的时候，还会无从下手。所以今天小编就和大家推荐一款实用的书签插件，这款插件就是“蓝色书签”。...
通过Chrome 插件快速同步Chrome书签
sweet_tea_的博客
05-25
3054
实验室新配置了一台主机，想同步一下新旧电脑的书签，手动过于麻烦，这款Chrome 插件还是很好用的，无需科学上网。
功能：
同步： 自动把浏览器的书签同步到云端，支持多台电脑的浏览器书签数据。同一个账号，同一份数据。
备份： 每日、每周、每月自动备份书签数据，便于恢复理数据。
排序： 书签按照字母排序。方便查找，让书签一目了然。
去重： 当书签存在重复时，只保留一个；当目录出现重复时，将合并目录的内容。
操作：安装好插件后，微信扫一扫即可登录。
插件安装步骤：
1、首先去插件官网下载该插件chrome_sy
IntelliJ IDEA 小技巧：Bookmark(书签)的使用
DATANGguanjunhou的博客
07-13
1万+
1.创建书签
在你想要创建书签的地方，按F11键，那个地方就会出现一个对号，这就创建了一个书签。
如果你想对这个书签做一个特殊的标记，IDEA也是支持的，同时按Ctrl +F11，会出现如下的界面，这个叫做“书签助记符”。
如果你点击A，那么书签就会变成下图那样，而不是一个对号。
也有快速添加助记符书签的快捷键，Ctrl + shift + 数字键。注意，这个快捷键只支持0-9十个数字助记符书签的快速添加。
2.编辑书签
创建了书签之后，按shift + F11可以查看全部已存在的书签。
你可以点击
谷歌浏览器开发文档获取书签_使用书签更快地浏览Word文档
culiuman3228的博客
09-19
111
谷歌浏览器开发文档获取书签Have you ever had a large Word document and needed to get to a specific part of it quickly? Here we take a look at how to add bookmarks to sections of documents in Word versions 2003 and ...
chrome扩展程序获取当前页面URL和HTML内容
weixin_34081595的博客
07-30
8590
先交代一下manifest.json中的配置
// 引入注入脚本"content_scripts": [ { "js": ["content_script.js"], // 在什么情况下使用该脚本 "matches": [ "http://*/*", "https://*/*" ], // 什么情况下运行【文档加载开始】 "run_a...
chrome扩展开发（3）- 书签功能的四种实现方式综述
huazai2019wzqj的博客
05-04
676
秉持匠心精神，不求做大做强，始终关注如何利用JS栈技术改善日常工作和生活
一、本文目标
系统梳理在chrome浏览器中实现书签功能的多种方式。
二、适合读者
1.经常使用chrome浏览器的人。
2.时不时因为忘了某个网站的地址而烦恼的人。
三、四种实现方式综述
1.浏览器自带的书签功能
浏览器地址栏下面一行就是书签栏，如下图红框中所示：
如果书签栏没有显示出来，则需要点击地址栏最右侧的“三...
Chrome插件开发学习心得（一）之前期开发
二哈的欢乐世界
02-15
1476
突然奇想，想学下开发浏览器插件，比如做个抢票插件什么的，所以也算是我的学习笔记吧。这个也算是从零开始，希望给自己留一份笔记，同时也让看到这个的人少走一些弯路，废话到这里了。
首先，前面背景，好处什么的都不说了，不好这口，直接进入主题。
一：开发资料
Chrome浏览器扩展开发之自动化操作页面
chen29717的博客
07-12
577
Chrome浏览器扩展开发之自动化操作页面
b/s开发javascripthtml5htmlcssjquerychrome浏览器扩展作者：行动派
Chrome浏览器支持扩展（Extension）开发，来定制扩展现有的功能，如：自动登录，定时刷新，抢票等功能，本文以一个简单的小例子，简述Google Chrome 扩展开发的基本步骤，仅供学习分享使用。
什么是Chrome扩展？
Chrome扩展使用HTML、JavaScript、CSS和图片等Web技术开发，用以增强Chrome浏览器功能的一种程序。Chro
chrome启用插件_如何在Google Chrome中启用和使用标签组
cum88284的博客
10-03
747
chrome启用插件Are too many tabs cluttering up your Chrome browser? Google’s working on a solution to help organize all the tabs you have open. The Tab Groups feature provides neat, color-coded labeling fo...
【干货】Chrome插件(扩展)开发全攻略
qq_34998786的博客
12-07
8638
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍作者：小茗同学https://www.cnblogs.com/liuxianan/p/chrome-plugin-develop.html#!comments...
Chrome插件 - 【API】Chrome.Bookmark
⚡⚡⚡
03-25
1380
在插件中实现对书签的管理，首先需要从Chrome浏览器获得相应的接口：Chrome.bookmarks
即在Manifest中声明bookmarks权限： "permissions": ["bookmarks" ]
我们将要操作的书签将会以Object的形式出现，该书签对象具有8个可操作属性（其中id是必选属性）：
id、parentId、index、url、title、da...
Intellij IDEA神器那些让人爱不释手的小技巧
热门推荐
Sam_Deep_Thinking
06-03
4万+
概述
在2018年5月6日写了一篇介绍IntellIJ IDEA的文章,Intellij IDEA神器居然还有这些小技巧,主要是列出一些平时大家可能没用过或者没怎么用，但是又非常好用的IntellIJ IDEA小技巧。由于篇幅原因，只是列出了一小部分，那么接下来的这篇文章，会继续补充一些IntellIJ IDEA的小技巧。
别轻易自定义快捷键
有蛮多操作，IntellIJ I...
“相关推荐”对你有帮助么？
非常没帮助
没帮助
一般
有帮助
非常有帮助
提交
©️2022 CSDN
皮肤主题：大白
设计师：CSDN官方博客
返回首页
且听真言
CSDN认证博客专家
CSDN认证企业博客
码龄7年
暂无认证
215
原创
3万+
周排名
5381
总排名
32万+
访问
等级
5460
积分
59
粉丝
266
获赞
44
评论
268
收藏
私信
关注
热门文章
微信小程序实现首次启动引导页只显示一次
16890
解决小程序text换行的问题
12709
微信小程序真机调试报错解决方案 error code 50003
12669
chrome扩展cookie使用
11846
Android实现清除应用程序缓存
10447
分类专栏
算法
3篇
Android
13篇
Kotlin
40篇
Flutter
Android源码设计模式
24篇
framework
23篇
Chrome插件开发
4篇
深入理解JavaScript
55篇
React
5篇
微信小程序开发
23篇
工具
1篇
移动开发
69篇
Camera
2篇
Android音乐播放
1篇
Android图片处理
5篇
动画
1篇
java
3篇
io
1篇
自定义控件
1篇
Chrome插件开发
2篇
Web前端
66篇
Android设计模式
27篇
javascript
60篇
ES6
55篇
微信小程序
22篇
React
4篇
framework
27篇
最新评论
微信小程序中获取当月的所有天数
hjt497821976:
不行的啊；我这边获取的怎么是 第一天的日期，就是1；
Chrome扩展之书签
m0_71997992:
都很好，没意见
LeakCanary使用学习（未完）
weixin_39521702:
18969017181，你好，有蓝牙小程序项目合作
Chrome扩展开发总结之浏览器书签获取
一个爱编程的男孩:
真是活到老学到老～给博主点个赞～
微信小程序中app.js中无法调用setData方法的
godShenzzZ:
app js
getData(that){}
页面JS
onload() {
app.getData(this)
这样就可以了吧
您愿意向朋友推荐“博客详情页”吗？
强烈不推荐
不推荐
一般般
推荐
强烈推荐
提交
最新文章
20. 有效的括号
141. 环形链表
Android MAT的使用
2022年23篇
2021年5篇
2020年28篇
2019年82篇
2018年54篇
2016年26篇
目录
目录
分类专栏
算法
3篇
Android
13篇
Kotlin
40篇
Flutter
Android源码设计模式
24篇
framework
23篇
Chrome插件开发
4篇
深入理解JavaScript
55篇
React
5篇
微信小程序开发
23篇
工具
1篇
移动开发
69篇
Camera
2篇
Android音乐播放
1篇
Android图片处理
5篇
动画
1篇
java
3篇
io
1篇
自定义控件
1篇
Chrome插件开发
2篇
Web前端
66篇
Android设计模式
27篇
javascript
60篇
ES6
55篇
微信小程序
22篇
React
4篇
framework
27篇
目录
评论 1
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
查看更多评论
打赏作者
且听真言
你的鼓励将是我创作的最大动力
¥2
¥4
¥6
¥10
¥20
输入1-500的整数
余额支付
(余额：-- )
扫码支付
扫码支付：¥2
获取中
扫码支付
您的余额不足，请更换扫码支付或充值
打赏作者
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额
抵扣说明：
1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。 2.余额无法直接购买下载，可以购买VIP、C币套餐、付费专栏及课程。
余额充值