Chrome 扩展 - 只是将当前页面保存到本地 html 文件中

发布于 2024-12-06 10:41:53 字数 892 浏览 1 评论 0原文

我对 Chrome 扩展开发和网站技术（主要是 JS）都很陌生。

为了自学，我想创建一个 Chrome 扩展程序，可以将当前页面保存到桌面。我知道这只需通过“Ctrl+S”即可完成，但我想实现与 Chrome 扩展相同的功能。

如果可能的话，我想创建一个扩展，首先创建一个弹出菜单，其中顶行将是保存页面的按钮。

我试图自己解决这个问题，但是，我得到了下面的代码，该代码不起作用。您能给我一些如何继续的提示吗？

manifest.json

{
  "name": "Extract",
  "version": "2.0",
  "description": "The first extension that I made.",
  "browser_action": {
    "default_icon": "icon.png",
    "popup": "popup.html"
  },
  "permissions": [
    "tabs"
  ]
}

popup.html

<style>
body {
  min-width:357px;
  overflow-x:hidden;
}

img {
  margin:5px;
  border:2px solid black;
  vertical-align:middle;
  width:75px;
  height:75px;
}
</style>

<script>
function saveAsMe (filename)
{
    document.execCommand('SaveAs',null,filename)
}
</script>

提前致谢！

原文

I am new to both Chrome extension development and website techniques (mainly JS).

Trying to learn by myself, I wanted to create a Chrome extension that can save the current page, say, to desktop. I know this simply can be done by "Ctrl+S", but I want to implement the same thing as a Chrome extension.

If possible, I want to create an extension that first create a popup menu, in which the top row will be the button to save page.

I tried to figure it out by myself, however, I got the code below, which is not working. Could you please give me some hints on how to proceed?

manifest.json

{
  "name": "Extract",
  "version": "2.0",
  "description": "The first extension that I made.",
  "browser_action": {
    "default_icon": "icon.png",
    "popup": "popup.html"
  },
  "permissions": [
    "tabs"
  ]
}

popup.html

<style>
body {
  min-width:357px;
  overflow-x:hidden;
}

img {
  margin:5px;
  border:2px solid black;
  vertical-align:middle;
  width:75px;
  height:75px;
}
</style>

<script>
function saveAsMe (filename)
{
    document.execCommand('SaveAs',null,filename)
}
</script>

Thanks in advance!

分享到QQ

分享到微博