0

如果这听起来太简单，请耐心等待。

我正在编写一个 chrome 扩展程序，一旦用户右键单击页面中的对象，就会出现上下文菜单，并且他可以选择获取单击的 div 类的 ID + 对其进行评分。

我已经为此工作了几天，并设法将额外的按钮添加到上下文菜单中。一旦点击了这些按钮中的任何一个，就会记录页面的源。本来可以花更少的时间来做这件事，但这是我第一次用 javascript 编写，我一直卡在这个过程中。

无论如何，我不想要页面的整个 html 代码，而是点击的 div 类。我在谷歌搜索后发现最好的方法是使用 jquery 的“html”函数而不是纯 javascript。问题是它对我不起作用。

这是我的代码：

BackgroundPage（这里一切似乎都很好）

    function genericOnClick(tab) 
    {
        console.log(tab.pageUrl);

        chrome.tabs.getSelected(null, function(tab) 
        {
            chrome.tabs.sendMessage(tab.id, {action: "getSource"}, function(source) {
            console.log(source);
            });
        });

    }


    // Create a parent item and two children.
    var parent1 = chrome.contextMenus.create({"title": "Rank Trigger", "contexts":["all"]});

    var child1 = chrome.contextMenus.create
    (

    {"title": "Rank 1", "contexts":["all"], "parentId": parent1, "onclick": genericOnClick}
);
var child2 = chrome.contextMenus.create
(
    {"title": "Rank 2", "contexts":["all"], "parentId": parent1, "onclick": genericOnClick}
);
var child3 = chrome.contextMenus.create
(
    {"title": "Rank 3", "contexts":["all"], "parentId": parent1, "onclick": genericOnClick}
);

ContentPage：（这里有问题）

chrome.extension.onMessage.addListener(function(request, sender, callback) 
{
    if (request.action == "getSource")
    {
     // callback(document.documentElement.outerHTML); //here i can get the page's whole source, I only want the clicked div class
     callback($('div class).html(); <--- something wrong here
    }

  });

清单文件：

{
  "name": "x",
  "description": "x",
  "version": "0.1",
  "permissions": ["contextMenus", "tabs"],
  "content_scripts": 
  [
    {
      "matches": ["http://*/*","https://*/*"],
      "js": ["jquery.js", "content.js"],
      "run_at": "document_end"
    }
  ],
  "background": 
  {
    "scripts": ["background.js"]
  },
  "manifest_version": 2
}

有任何想法吗？我再次知道我的问题看起来很简单，但我是自学所有这些，并且出于某种原因，我发现 Web 编程比应用程序编程更难一些。

非常感谢。

编辑：只是为了澄清我想要的 html 源代码是这样的： <div class="story reviewed-product-story" data-story-id="488481648"....</div>。我想要这个 div 类，以便我可以解析它以获取数据故事 ID。如果有一种方法可以在不先获取 div 类的情况下获取 ID，那么它也可以工作（甚至可能更可取）

编辑：感谢 Adeneo，我现在可以获得页面源中第一个 div 类的 ID，但不能获得点击的 ID。在我拥有的东西上向前迈进了一步，但并不完全是我需要的东西。也许我必须在使用 $('.story').data('story-id') 之前获取点击的 div 的来源。有什么建议么？

4

1 回答 1

1

我猜应该是：

chrome.extension.onMessage.addListener(function(request, sender, callback) {
    console.log('message listener');
    if (request.action == "getSource") {
        callback( $('.story').data('story-id') );
    }
});
于 2013-02-15T16:08:32.040 回答