我需要实现一个chrome extension主要功能是点击按钮打开新的窗口获取页面html同时找到对应的元素进行点击
<p>以下是一个简单的Chrome扩展示例，可在点击按钮时打开新窗口，获取当前页面的HTML，并查找并点击指定的元素：</p>
<ol>
<li>
<p>在Chrome浏览器中创建一个新文件夹来保存您的扩展代码。</p>
</li>
<li>
<p>在该文件夹中创建一个名为manifest.json的文件，并在其中添加以下代码：</p>
</li>
</ol>
<p>{
"manifest_version": 2,
"name": "My Extension",
"version": "1.0",
"description": "My Chrome Extension",
"browser_action": {
"default_popup": "popup.html"
},
"permissions": [
"activeTab",
"tabs"
]
}</p>
<ol start="3">
<li>创建一个名为popup.html的文件，并在其中添加以下代码：</li>
</ol>
<!DOCTYPE html>
<html>
<head>
<title>My Extension</title>
<script src="popup.js"></script>
</head>
<body>
<button id="myButton">Click me!</button>
</body>
</html>
<ol start="4">
<li>创建一个名为popup.js的文件，并在其中添加以下代码：</li>
</ol>
<p>document.addEventListener("DOMContentLoaded", function() {
var myButton = document.getElementById("myButton");
myButton.addEventListener("click", function() {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
var currentTab = tabs[0];
chrome.windows.create({url: currentTab.url}, function(newWindow) {
chrome.tabs.executeScript(newWindow.tabs[0].id, {code: "document.documentElement.outerHTML"}, function(html) {
console.log(html[0]);
chrome.tabs.executeScript(newWindow.tabs[0].id, {code: "document.querySelector('a').click();"});
});
});
});
});
});</p>
<ol start="5">
<li>
<p>在Chrome浏览器中打开扩展程序页面（chrome://extensions/）并启用开发者模式。</p>
</li>
<li>
<p>点击“加载已解压的扩展程序”按钮，选择您的扩展文件夹并加载它。</p>
</li>
<li>
<p>单击浏览器工具栏中的扩展程序图标，然后单击“Click me！”按钮，即可打开一个新窗口并在控制台中显示当前页面的HTML，并模拟点击第一个链接元素。</p>
</li>
</ol>
<p>注意：这只是一个简单的示例，您需要根据自己的需求进行修改和扩展。此外，请注意在使用Chrome扩展程序时，应遵守Chrome Web Store开发者政策和Chrome Web Store服务条款</p>
原文地址: https://www.cveoy.top/t/topic/ffME 著作权归作者所有。请勿转载和采集!