自从有了Chrome以后,就喜欢上了这个浏览器,从此IE 886了。

以前作爬虫,做登录,做数据采集,做数据处理等各种功能,后来H5出来后,出现了,除了Session/Cookie 出了Local Storage,暂时还没有更好的办法获取Local Storage。由于处理的数据比较少,所以决定研究一下Chrome Extension。

百度了一下Chrome Extension,可以通过Chrome Extension 官网进行学习,简单上手。网址: https://developer.chrome.com/extensions

要解决的问题:

公司OA使用了很多年了,其中的流程备案记录很少关注查看,今天公司通知最近要检查,确认大家是否都看了,否则会进行处罚。今天要解决的问题就是自动把所有的未查看过的抄送记录,都确认为已阅读。

解决方案:

本来可以通过SQL语句,修改数据库的是否阅读状态。这是最近单的方式,但是和Chrome Extension 就没有关系了。

所以还是通过模拟的方式,通过点击一个按钮自动浏览本页的所有标记为未读的记录。

操作记录:

进入流程抄送记录,点击【自动浏览】开始操作。

点击自动浏览后,会自动在该Chrome页面上打开多个浏览器页签显示所有未读的记录

软件开发中问题汇总:

怎么使用Jquery

自动使用Juquery原来,对原生的js是越来越陌生了,写Js第一件事就是下载一个Jquery用上。

在 manifest.json中配置对应的jquery路径,然后在contentscript.js和background.js中就可以使用Jquery了。

Chrome Extension的图标怎么设置呢?

看到上面manifest.json中的icons属性了吗?设置上对应的图标即可。注意大小。

点击Chrome Extension图标,展示的页面

这是一个特别特别简单的html页面,只有一个按钮,最后加了一个index.js的js文件,一定要引用到最后。Js文件主要是对该弹出页进行操作。

这个插件只有一个动作,就是点击上面的【自动浏览】按钮。

点击【自动浏览】按钮的逻辑

点击按钮后,按钮颜色编成蓝色,如果有其他按钮,则其他按钮字体颜色为黑色,另外:点击按钮后,与当前网页进行通讯,返回页面上所有没有浏览记录的ID,并用【;】分割。

处理网页数据的页面逻辑

通过jquery查询当前页面中所有的未读记录,遍历并把所有的id用【;】分割。

一定要有return true.

写在最后:

刚开始结束的时候,经历了各种坎坷,

由于是Chrome Extension与页面的数据进行通讯,各种搞不定,现在基本可以通过这个模式化的界面与各种服务、http页面等进行互操作了。

通过这次Chrome Extension的开发,不仅重新熟悉了各种js,而且最重要的是,以后简单的爬虫,再也不用打开vs,吭哧坑成的编程啦。

Chrome Extension 小试牛刀的更多相关文章

  1. Chrome Extension 检查视图(无效)处理方法

    最近闲来无事,简单看了下Chrome扩展的开发,并且开发一个小小的翻译插件(TranslateBao)作为练手,开发细节不详述了,如果有新学习chrome extension开发的新人,可以参考源码, ...

  2. 开发Chrome Extension截取你微博的帐号密码

    Google允许开发者对Chrome浏览器做扩展,所以有了之前火爆的12306抢票软件,我 也用它抢过票,一直很好奇它怎么注入js到12306上面的.这周有空研究了下Chrome Extension, ...

  3. chrome extension overview

    目录 什么是扩展............................................................................................ ...

  4. 打包Egret游戏为Chrome extension

    今天,本来是打算做一个Chrome扩展去爬取网站base64编码图片的. 在跟着图灵社区<Chrome扩展及应用开发>敲demo代码的过程中,发现chrome的扩展的结构理论上可以兼容所有 ...

  5. Google Chrome Native Messaging开发实录(二)Chrome Extension扩展

    接上一篇<Google Chrome Native Messaging开发实录(一)背景介绍>的项目背景,话不多说,有关Chrome Extension介绍和文档就不展开了,直接上代码. ...

  6. Chrome Extension 实战

    想起个问题,线上项目js要有bug,怎么进行调试修改. ------------- 想起来,方法应该是,拦截线上的js的请求,转到本地代码上进行调试... ------------- 网上看到 Chr ...

  7. 解决chrome extension无法下载的问题

    由于GFW把谷歌应用商店给屏蔽了,下载chrome扩展变得很困难. 我使用的是版本30.0.1599.101 m. 那么你需要做的第一个处理是,修改host文件,保证chrome应用商店可以登录.如下 ...

  8. 一起来做Chrome Extension《搭个架子》

    CEF - A simple Chrome Extension development falsework CEF是一个简单的Chrome Extension开发脚手架,它有如下功能: 模块化的结构, ...

  9. 一起来做Chrome Extension《一些问题》

    目录 Unchecked runtime.lastError: The message port closed before a response wa received. 使用 eval Conte ...

随机推荐

  1. Spring容器启动源码解析

    1. 前言 最近搭建的工程都是基于SpringBoot,简化配置的感觉真爽.但有个以前的项目还是用SpringMvc写的,看到满满的配置xml文件,却有一种想去深入了解的冲动.折腾了好几天,决心去写这 ...

  2. java学习-IDEA相关使用

    1.配置git与github(用于将代码提交到GitHub) 添加自己的github账号 2.提交代码到github 登录https://github.com,即可看到刚刚提交到github的代码仓库 ...

  3. StringBuffer类讲解

    package Main; import java.util.Scanner; public class Main { public static void main(String[] args) { ...

  4. 简单认识JVM

    准备: 在具体聊JVM之前,我们先看两张图,通过分析图,咱们慢慢来聊聊JVM. JVM内存结构图 JVM内存结构脑图 上面两张图中,第二张图相对来说比较直观,就是JVM内存结构都划分成了哪些模块,各个 ...

  5. 06 python学习笔记-常用模块(六)

    一.  模块.包 1.什么是模块? Python 模块(Module),是一个 Python 文件,以 .py 结尾,包含了 Python 对象定义和Python语句,是用来组织代码的.模块能定义函数 ...

  6. Mysql数据库(三)Mysql表结构管理

    一.MySQL数据类型 1.数字类型 (1)整数数据类型包括TINYINT/BIT/BOOL/SMALLINT/MEDIUMINT/INT/BIGINT (2)浮点数据类型包括FLOAT/DOUBLE ...

  7. CSS3 变形、过渡、动画、关联属性浅析

    一.变形 transform:可以对元素对象进行旋转rotate.缩放scale.移动translate.倾斜skew.矩阵变形matrix.示例: transform: rotate(90deg) ...

  8. [UWP]使用PointLight并实现动画效果

    1. Composition Lighting UWP中的Composition Light是一组可以创建3D光照的API,它明明十分好玩而且强大, 但博客园几乎没有相关文章(用UWP或pointli ...

  9. linux sudo root 权限绕过漏洞(CVE-2019-14287)

    0x01 逛圈子社区论坛 看到了 linux sudo root 权限绕过漏洞(CVE-2019-14287) 跟着复现下 综合来说 这个漏洞作用不大  需要以下几个前提条件 1.知道当前普通用户的密 ...

  10. 【XSY2558】圆上的蚂蚁 Ants on circle

    Description L个点围成一个圆. 我们选定任意一个点作为原点, 则每个点的坐标为从原点顺时针走到这个点的距离. 圆上有N只蚂蚁, 分别被编号为1到N. 开始时, 第ii只蚂蚁在坐标为Xi的点 ...