博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
为Chrome开发插件提高工作效率
阅读量:5308 次
发布时间:2019-06-14

本文共 877 字,大约阅读时间需要 2 分钟。

工作生活,什么最珍贵,我觉得是时间,怎么节约时间是一个最重要的问题,如果你有重复的工作在网页上,请接着看

 

上手步骤:

  • 打开https://developer.chrome.com/extensions/getstarted,分别下载需要的文件(3个)到一个文件夹
  • 打开chrome://extensions,选中开发模式,加载这个文件夹
  • 浏览右方就出现一个图标,你就可以试试这个demo了

 

开发步骤:

现在可以写个自己想要的东西了

  • 用喜欢的文件编辑器打开popup.html,加上自己想要的按钮,UI,标记好ID好关联点击事件
  • 打开popup.js, 给相关的DOM添加点击方法
document.addEventListener('DOMContentLoaded', () => {    var btnAdd = document.getElementById('btnAdd');    btnAdd.addEventListener('click', () => {        openAddPage();    });...
  • 保存后,不需要重新加载,再次点击浏览器右上方的图标,打开你的插件,就已经加载了最新的代码,这个要给google一个赞
  • 需要注意的是,插件中不可以调用原页面代码中的方法或者对象,只能选取DOM元素,然后操作像下面一样
if(document.querySelector('.button').innerText == 'Add'){document.querySelector('.button').click()};
  • 问题是怎么知道你写的代码是工作的呢?如果需要不停的重试,那效率就太差了,Google已经帮你想到,答案就是,打开浏览器的调试模式(F12),切换到控制台,在里面可以直接打入代码,验证代码是否可以工作,Google是走心的
  • 把调试正确后的代码合并到popup.js
  • 到这里相信你已经大功造成。

 

转载于:https://www.cnblogs.com/DataFlow/p/8584287.html

你可能感兴趣的文章
iframe的父子层跨域 用了百度的postMessage()方法
查看>>
图片生成缩略图
查看>>
动态规划 例子与复杂度
查看>>
查看oracle数据库的连接数以及用户
查看>>
【数据结构】栈结构操作示例
查看>>
中建项目环境迁移说明
查看>>
三.野指针和free
查看>>
activemq5.14+zookeeper3.4.9实现高可用
查看>>
TCP/IP详解学习笔记(3)IP协议ARP协议和RARP协议
查看>>
简单【用户输入验证】
查看>>
python tkinter GUI绘制,以及点击更新显示图片
查看>>
CS0103: The name ‘Scripts’ does not exist in the current context解决方法
查看>>
20130330java基础学习笔记-语句_for循环嵌套练习2
查看>>
Spring面试题
查看>>
窥视SP2010--第一章节--SP2010开发者路线图
查看>>
C语言栈的实现
查看>>
代码为什么需要重构
查看>>
TC SRM 593 DIV1 250
查看>>
SRM 628 DIV2
查看>>
2018-2019-2 20165314『网络对抗技术』Exp5:MSF基础应用
查看>>