chrome插件提供了查找tab的api
chrome.tabs.get(integer tabId, function callback)
但是出于安全的考虑,tab的属性中没有document
因此无法在扩展中直接获取某个页签页面中的页面元素
但是tab有这样一个方法
chrome.tabs.sendRequest(integer tabId, any request, function responseCallback)
他可以在扩展中可以对某一个tab进行请求,发送请求信息;
在对应的tab页面中通过
chrome.extension.onRequest.addListener(function(any request, MessageSender sender, function sendResponse) {...});
对扩展中的请求进行监听,根据监听到的信息,决定要做的事情
简单一点的,简明实例:
一、在扩展中 添加 发送事件请求 的代码
chrome.tabs.sendRequest(tab_id, {
hello: "ok"
}, function(response) {
// tab做出响应,发来的response
})
二、在 tab中添加 事件监听的代码
在manifest.json中添加
"content_scripts": [
{
"matches": ["*://*/*"],
"js": ["jquery.min.js","test.js"]
}
],
"permissions": ["*://*/*","tabs"]
其目的是在每个页签页面加载的时候同时载入这两个js,获取tabs的权限
在test.js 中放入监听 扩展 请求事件的代码
chrome.extension.onRequest.addListener(
function(request, sender, sendResponse) {
if (request.hello == "ok"){ // 在得到request请求是ok的时候 做下面的操作
sendResponse({
data: $("#hello") // 获取id是hello的元素发过去
});
}
}
);
分享到:
相关推荐
在这个压缩包中,包含了创建一个Chrome扩展程序所需的基本文件: 1. **popup.html**:这是扩展程序弹出窗口的HTML文件,用户可以通过点击浏览器右上角的插件图标打开。这个窗口通常用于显示设置或者提供与扩展功能...
一个基本的Chrome插件通常包含以下几个部分:manifest.json(插件的配置文件)、background.js(后台脚本,处理非交互逻辑)、content_script.js(内容脚本,与网页交互)以及可能的HTML和CSS文件(用于创建用户界面...
总的来说,"chrome newtab扩展程序"涉及了Chrome扩展开发、前端编程、JavaScript事件处理、搜索引擎优化(SEO)等多个IT领域的知识。通过学习这些技能,开发者可以创造出更个性化、高效的浏览器体验,同时也能提升...
标签"IETab Chrome"进一步强调了这个扩展与IE和Chrome的关系,它是Chrome的一个扩展,专门用于处理与IE相关的需求。 在压缩包子文件中,"ietabhelper.exe"和"ietabhelper.msi"是两个重要的组件。"ietabhelper.exe...
"chrome-extension-newtab" 是一个专为 Chrome 浏览器设计的扩展,旨在优化新标签页的体验。通过使用这个扩展,用户可以将新打开的标签页设置为自己喜欢的样式或功能,替代默认的空白页面或 Google 搜索框。 首先,...
在Chrome扩展中,JavaScript用于处理用户交互、与Chrome浏览器API进行通信以及修改页面内容等任务。在"chrome-tab-count"这个项目中,JavaScript主要负责监听浏览器的事件,如标签页的打开和关闭,然后实时更新图标...
本文将详细介绍如何使用Chrome扩展程序以及JavaScript API来实现这一功能。 首先,我们要了解Chrome扩展程序(Extension)的概念。Chrome扩展是基于Web技术(HTML、CSS和JavaScript)构建的小型软件应用,它们可以...
在"electron-chrome-tabs"中,开发者可以通过JavaScript调用API,动态地创建和更新标签页,实现界面的实时交互。例如,可以使用JavaScript事件监听和处理机制,当用户点击新建标签按钮时,触发相应的函数来创建一个...
标签 "chrome ie-tab" 明确了这个扩展与Chrome浏览器以及IE相关的特性有关。这有助于用户在搜索类似功能的扩展时能够快速识别。 在压缩包中,除了核心组件ietabhelper.exe之外,还有 "14.4.8.1_0" 这个文件。这可能...
4. **Chrome API**:Chrome提供了丰富的API供扩展使用,荏苒可能利用这些API与浏览器进行交互,例如获取用户设置、存储数据(chrome.storage API)、更改新标签页内容(chrome.tabs API)等。 5. **事件监听**:荏...
JavaScript,作为Web开发的核心语言,经常被用来创建动态交互的网页内容,包括浏览器扩展。Chrome的扩展主要基于HTML、CSS和JavaScript编写,开发者可以通过Chrome的API来增强浏览器的功能,比如管理标签页。 ...
在本案例中,"Chrome扩展实现在打开的选项卡之间快速切换"是一个旨在提高用户工作效率的工具,它允许用户在多个打开的浏览器选项卡间便捷地切换,而无需逐一点击或使用浏览器内置的切换快捷键。 首先,我们需要了解...
`ChromeLikeTabSwitcher`就是这样一个自定义控件,它扩展了Android的标准UI组件,以满足特定的需求,比如模拟Chrome的标签页行为。 **3. 自定义View的实现** 要创建一个像`ChromeLikeTabSwitcher`这样的自定义控件...
3. `content_script.js` - 内容脚本,可以直接与网页交互,实现对标签页的折叠和展开功能。 4. `popup.html` 和 `popup.js` - 弹出窗口的HTML和JavaScript,用户可能通过点击扩展图标来访问这个弹出窗口,进行设置或...
开发者通过这个页面与用户交互,允许用户定制扩展的行为。 `new_tab.html` 文件则是新标签页的主体内容,当用户打开新的标签页时,浏览器加载的就是这个文件。它通常包含了扩展的核心功能,比如展示预设的壁纸、...
2. **JavaScript编程**:作为Chrome扩展的主要开发语言,JavaScript用于编写扩展的背景脚本、内容脚本和用户界面交互。例如,使用chrome.tabs API获取和操作浏览器的标签页信息。 3. **Chrome浏览器API**:Chrome...
综上所述,从这些文件中可以学习到Chrome如何实现标签页的UI交互、进程管理、内存优化以及扩展支持等多个方面的技术细节。通过阅读和理解这些源码,开发者可以深入理解浏览器的内部机制,并可能基于此开发自己的...
还有些扩展能够和浏览器的一些元素(如书签、tab 导航标签)交互。扩展还可以和 web 页面交互,甚至是从 web 服务器获取数据。 三、扩展组成 每个扩展由下列文件组成:一个 manifest 文件(主文件,json 格式)...
总的来说,"New_Tab:Chrome 扩展程序" 是一个利用 JavaScript 实现的Chrome扩展,提供了自定义的新标签页体验,集成了时钟功能和小游戏。它的开发涉及了Chrome扩展的架构、JavaScript编程、以及Google API的集成,...
由于 Chrome 扩展程序是在浏览器环境中运行的,因此通常使用 JavaScript 与浏览器的 APIs 进行交互,实现各种功能。 **文件名称列表:chrome-good-tab-master** 这个文件名可能代表项目的主分支或者源代码仓库。...