Question

我在考虑使用jQuery，但在Chrome扩展程序和JavaScript方面我很缺乏经验。当用户点击按钮时，我需要从页面中获取div（带有id，它是静态的，但内容是动态的）。我无法从当前页面抓取内容，并想知道是否有人可以给我一些提示或指导我找到相关的答案/教程。

感谢。

Answer 1

如果您只想将div的内容作为查询提交给Google，那么只需要一个简单的内容即可，不需要jQuery。

window.location = 'http://www.google.com/search?q='+encodeuricomponent(document.getElementById('theid').innerHTML);

Answer 2

如果您知道ID，可以使用jQuery id-Selector：http://api.jquery.com/id-selector/ 找到div后，您可以使用此方法http://api.jquery.com/text/

获取其文本

Answer 3

好的，所以要做你想做的事，你需要做三件事。首先是学习如何使用content scripts将代码注入给定选项卡。第二个是从标签中获取您想要的信息，最后一个是使用您在步骤2中获得的字符串进行搜索。所有这些的示例如下。对于此代码，我将使用domain.com作为您要从中获取信息的网站。

<强>的manifest.json

"background": {
  "scripts": ["background.js"]
},
"permissions": [
  "tabs","*://www.domain.com/*"
],
"content_scripts": [{
  "matches": ["*://www.domain.com/*"],
  "js": ["jquery.js","getText.js"]
}]

<强> getText.js

$('#buttonID').click(function(){
  // I am assuming that the contents are directly what you want to search with 
  var text = $('#divID').text();
  // At this point you could simply use window.location to search in this tab
  // but in the case you would rather open a new tab to search in
  // I will show you that as an example
  chrome.runtime.sendMessage({method:'searchText',text:text});
});

<强> background.js

chrome.runtime.onMessage.addListener(function(message,sender,sendResponse){
  if(message.method == 'searchText'){
    var url = "http://www.google.com/search?q="+encodeuricomponent(message.text);
    chrome.tabs.create({url:url});
  } 
});

此代码会将content script注入所需的页面，在单击按钮时从所需的div中获取文本，将该文本发送到后台页面，然后打开一个包含该文本的新选项卡搜索参数。我有点把它写在袖口上，对于任何语法错误都很抱歉此外，不需要jQuery，因为您可以使用纯JavaScript执行此操作，但我向您展示了如何使用它，以防您需要其他内容。

如何从当前页面和Google获取div的内容呢？

3 个答案: