如何使用javascript创建书签文件夹？

Question

我正在查看 bookmarks.create() 的 MDN Javascript API 示例。我正在尝试实现他们必须学习如何制作文件夹的示例：

function onBookmarkAdded(bookmarkItem) {
  console.log("Bookmark added with ID: " + bookmarkItem.id);
}

chrome.bookmarks.create({
  title: "bookmarks.create() on MDN",
  url: "https://developer.mozilla.org/Add-ons/WebExtensions/API/bookmarks/create"
}, onBookmarkAdded);

据我所知，这没有任何作用。任何有关如何制作书签文件夹的帮助或其他示例将不胜感激。

Answer 1

假设您已添加"bookmaks"到permissions您的manifest.json文件中，那么您的代码将按照编写的方式工作以创建书签。由于您的manifest.json文件未包含在问题中，因此我们无法确定这是否是问题所在。

要创建书签文件夹，您可以省略该属性或在传递给的对象中url提供url:nullbookmark.create()

下面是完整的、经过测试的（在 FF48.0.2 和开发版，FF50.0a2 上）扩展。它包含在允许browser_action单击按钮时创建书签的代码中。我发现在单击按钮时执行测试browser_action比仅在安装/Firefox 运行时执行更容易。它会：

1. 创建一个标题为并链接的书签：bookmarks.create() on MDN
2. 创建书签文件夹My Bookmark Folder A
3. 创建书签文件夹My Bookmark Folder B
4. My Bookmark Folder B.1在其中创建一个书签文件夹My Bookmark Folder B

所有这些都是在“其他书签”下创建的，因为在调用任何不是此扩展创建的书签文件夹子级的书签时，不会parentId提供任何内容。bookmark.create()

背景.js：

//* For testing, open the Browser Console
try{
    //alert() is not supported in Firefox. This forces the Browser Console open.
    //  This abuse of a misfeature works in FF49.0b+, not in FF48
    alert('Open the Browser Console.');
}catch(e){
    //alert() throws an error in Firefox versions below 49
    console.log('Alert() threw an error. Probably Firefox version below 49.');
}
//*

chrome.browserAction.onClicked.addListener(function(tab) {
    doBrowserAction();
});

function doBrowserAction(){
    console.log('Background: Doing action');
    createABookmark();
    createABookmarkFolder();
    createABookmarkFolderWithinABookmarkFolder();
}

function onBookmarkAdded(bookmarkItem) {
  console.log("Bookmark added with ID: " + bookmarkItem.id, bookmarkItem);
}

function createABookmark(){
    chrome.bookmarks.create({
      title: "bookmarks.create() on MDN",
      url: "https://developer.mozilla.org/Add-ons/WebExtensions/API/bookmarks/create"
    }, onBookmarkAdded);
}

function createABookmarkFolder(){
    chrome.bookmarks.create({
      title: "My Bookmark Folder A",
      url: null
    }, onBookmarkAdded);
}

function createABookmarkFolderWithinABookmarkFolder(){
    chrome.bookmarks.create({
      title: "My Bookmark Folder B",
      url: null
    }, bookmarkItem => {
        onBookmarkAdded(bookmarkItem);
        chrome.bookmarks.create({
          title: "My Bookmark Folder B.1",
          url: null,
          parentId: bookmarkItem.id
        },onBookmarkAdded 
        );
    });
}

清单.json：

{
    "description": "Create a bookmark on browser_action button click",
    "manifest_version": 2,
    "name": "Demo: Create Bookmark",
    "version": "0.1",

    "applications": {
        "gecko": {
            //Firefox: must define id to use some features (e.g. option_ui)
            "id": "demo-create-bookmark@example.com",
            "strict_min_version": "48.0"
        }
    },

    "permissions": [
        "bookmarks"
    ],

    "background": {
        "scripts": [
            "background.js"
        ]
    },

    "browser_action": {
        "default_icon": {
            "32": "myIcon.png"
        },
        "default_title": "Do Action",
        "browser_style": true
    }
}

显然，如果您打算将各种函数用于演示以外的用途，您将希望使它们具有更通用的用途（即传递回调、书签属性等）。

注意：请参阅本答案标题为“有关在 Firefox 中测试和开发 WebExtensions 的一般说明”的部分。您的陈述“据我所知，这没有任何作用”意味着您没有在浏览器控制台中查看错误消息或控制台日志。