让Chatgpt写了个Chrome extension。 可以改变文学城的背景颜色,如此简单。有意思

本帖于 2023-12-16 11:20:51 时间, 由普通用户 freemanli01 编辑

想找一个chrome extension, 让浏览器底色暗一点,眼睛舒服些。后来听说网上的Stylish等现成的程序都有过收集用户信息的历史,

所以问了chatgpt, 能不能做,结果人家立马就完成了。

如下是生成的几个小程序,放到一个文件夹,然后加载一下。很多页面的背景颜色就可以自己设定了。

Choose Background Color

   

   

content.js

// Read the stored color and apply it when the page loads

chrome.storage.sync.get(["backgroundColor"], function (result) {

  if (result.backgroundColor) {

    document.body.style.backgroundColor = result.backgroundColor;

  }

});

 

// Listen for messages to change the color

chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {

  if (request.action === "changeColor") {

    document.body.style.backgroundColor = request.color;

    // Store the color for future pages

    chrome.storage.sync.set({ backgroundColor: request.color });

  }

});

manifest.json

{

  "manifest_version": 2,

  "name": "Background Changer",

  "version": "1.0",

  "description": "Change background color of all websites",

 

  "permissions": ["activeTab", "storage"],

 

  "browser_action": {

    "default_icon": "icon.png",

    "default_popup": "popup.html"

  },

  "content_scripts": [

    {

      "matches": [""],

      "js": ["content.js"]

    }

  ]

}

popup.html

 

 

popup.js

document.getElementById("applyButton").addEventListener("click", function () {

  var color = document.getElementById("colorPicker").value;

  chrome.storage.sync.set({ backgroundColor: color }, function () {

    console.log("Color is set to " + color);

  });

});

 

On the left are the file names, and the right are the content of each file.

Create a folder with any name you like, save all four files into that folder, and then create an icon.png file for the extension, save in the same folder.

 

In the google chrome, go to “Chrome://extension” --> on the top right corner, click “Developer mode” to enable it.  --> click “load unpacked” -->从新启动chrome, 可以用了。

注意要在extension manager 里 enable这个extension . 然后点击,就可以选背景颜色了.(下图那个 方框里的C, 就是那个icon)

 

所有跟帖: 

见识了。 -lovecat08- 给 lovecat08 发送悄悄话 lovecat08 的博客首页 (0 bytes) () 12/16/2023 postreply 13:59:16

多谢 -lovecat08- 给 lovecat08 发送悄悄话 lovecat08 的博客首页 (0 bytes) () 12/16/2023 postreply 13:59:34

AI就这么来了 -freemanli01- 给 freemanli01 发送悄悄话 freemanli01 的博客首页 (0 bytes) () 12/16/2023 postreply 15:03:43

很酷 -颤音- 给 颤音 发送悄悄话 颤音 的博客首页 (0 bytes) () 12/16/2023 postreply 16:26:05

世道变了。。。AI 来的快啊,我今天是没想到,灵机一动试试吧,没想到这么惊艳 -freemanli01- 给 freemanli01 发送悄悄话 freemanli01 的博客首页 (0 bytes) () 12/16/2023 postreply 17:40:53

文学城雇了顶尖的电脑程计师,高薪! -lovecat08- 给 lovecat08 发送悄悄话 lovecat08 的博客首页 (0 bytes) () 12/16/2023 postreply 18:35:23

他们曾跟我通话,研究新页设计。 -lovecat08- 给 lovecat08 发送悄悄话 lovecat08 的博客首页 (0 bytes) () 12/16/2023 postreply 18:47:31

哇,是询问技术问题,还是询问界面方面的客户需求?不知道您的背景。。。故有此一问也 -freemanli01- 给 freemanli01 发送悄悄话 freemanli01 的博客首页 (0 bytes) () 12/16/2023 postreply 19:40:39

请您先登陆,再发跟帖!