抓取html对象插件,chrome扩展获取页面dom对象信息(new)

引用地址:https://blog.csdn.net/weixin_35253082/article/details/117801223?spm=1035.2023.3001.6557&utm_medium=distribute.pc_relevant_bbs_down.none-task-blog-2defaultOPENSEARCHdefault-17.nonecase&depth_1-utm_source=distribute.pc_relevant_bbs_down.none-task-blog-2defaultOPENSEARCHdefault-17.nonecase

chrome扩展,在popup页面,给页面对象绑定点击事件,获取当前tab加载页面的DOM对象信息。本chrome扩展功能主要用于获取百度搜索输入框中用户输入的关键字。效果如下

0053172346.jpg

源代码如下注意:以下文件全部以utf-8文件编码保存

manifest.json

{undefined

"name": "chrome扩展获取页面dom对象信息",

"manifest_version": 2,

"version": "1.0",

"author":"showbo,http://www.coding123.net",

"description": "chrome扩展,在popup页面,给页面对象绑定点击事件,获取当前tab加载页面的DOM对象信息。本chrome扩展功能主要用于获取百度搜索输入框中用户输入的关键字。",

"browser_action": {"default_popup": "popup.html"},

"content_scripts": [{"matches": ["😕//*"],"js": ["baidu.js"]}],

"permissions": ["😕//*","tabs"]

}

popup.html注意事项:chrome扩展不支持inline-script,绑定事件的代码需要放到外部js文件中,也不能直接在DOM对象上添加click事件html>

chrome extension获取页面DOM对象
browser_action中的default_popup指定的页面
页面中DOM对象如何绑定事件并且获取当前页面的DOM对象信息

点击获取百度搜索输入框中的关键字

bindEvent.jsvar a = document.getElementById('a');

a.onclick = function () {//给对象绑定事件

chrome.tabs.getSelected(null, function (tab) {//获取当前tab

//向tab发送请求

chrome.tabs.sendRequest(tab.id, { action: "GetBaiduKeyWord" }, function (response) {undefined

alert(response.kw);

});

});

}baidu.jschrome.extension.onRequest.addListener(//监听扩展程序进程或内容脚本发送的请求

function (request, sender, sendResponse) {undefined

if (request.action == "GetBaiduKeyWord") {undefined

sendResponse({ kw: document.forms[0].wd.value });

}

}

);注意:chrome.tabs.sendRequest和chrome.extension.onRequest这2个对象在版本的chrome中将被废弃,使用chrome.runtime.sendMessage和chrome.runtime.onMessage代替。

由于本人的chrome版本为25,好像没有支持chrome.runtime对象,chrome.runtime为undefined(据说 chrome.runtime 对象chrome22+就支持了。搞毛。。?),懒得升级chrome,所以就没用chrome.runtime对象。

所以如果chrome扩展出错没有效果,可能是这2个对象的问题。

posted on   wdcwy  阅读(1374)  评论(0编辑  收藏  举报

相关博文:
阅读排行:
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
历史上的今天:
2017-01-16 Entity Framework Code First属性映射约定
2017-01-16 EF Code First:实体映射

导航

< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5
点击右上角即可分享
微信分享提示