利用浏览器收藏夹给网站扩展新功能

大家好今天给大家分享一下

如何利用浏览器的这个收藏夹

去扩展一些网站

从而去实现一些我们想要的功能

比方说现在这个网站哈

我就想一个一个字体的去试

看看哪个字体生成的

下边这个文字更好看一点

但是太麻烦了每一个我都需要点一下

然后再点一下提交

然后再点一个文字再点一下提交

所以呢我想能不能有一个按钮

然后点一下自动替我去预览下一个

好那我们来试一下

首先我们需要根据这个需求

写一段脚本

那这个需求分两步

第一步就是选中这个选择框里的

下一个

然后呢第二步是点这个按钮提交

我们来试一下先把控制台打开

那首先呢

我们先找到这个 select框

就这个 select name=FONT

我们来试一下哈

document.querySelector

name=FONT

嘿找到了

然后呢我们来取它的

嗯 select

selectedIndex

这是现在是第20个

那我们让他等于21试试

哎可以

所以呢

让他等于下一个 就是自身加1 就好了

++ 行不行

哎可以!那我们用++

好选中下一个之后呢

我们需要点一下这个 do it

看一下

这 do it 是一个image

type=image相当于一个

submit()

那他肯定是一个form表单

大家看这个,我们找一下form表单

好找到之后我们再调submit方法

哎可以了

然后你再把这两句代码合并一下

先调这个++

然后再调这个submit

合并成这样一行

然后我们一起执行

大家看可以了

好有了这句代码以后呢

我们就可以去利用浏览器的收藏夹

去执行这段代码

为什么呢

我先把这个关掉哈

因为我们通常在

浏览器的地址栏里边

是可以执行javascript代码的

比如说 :javascript:alert(1);

大家看!它是可以弹出来的

所以我在这

跳转到路径是javascript:

后边是刚才这段代码

理论上他就应该可以

哎不行

javascript

我看一下

找不到这个 selectedIndex

找不到这个

啊他这有frame

有frame的话

刚才我在这执行代码的时候

选择的应该是这个 (在第一个frame里面执行)

它是可以的

但如果在(浏览器)地址栏里边

相当于是在top里(最外层的网页)去执行这个代码

他就找不到

所以呢我们需要把这个代码改造一下

我们首先需要找到这个

frames

然后呢取它的应该是第0个

我们试一下哈

所以我们把刚才这个

0

包括这个

然后我们再在 top 里执行一下

复制一下(先)

哎!可以了

这回我们再在

浏览器里试一下:javascript

冒号粘贴

哎可以了

那接下来怎么做呢

我们需要把它添加到收藏夹里

这里边我已经加过了哈

已经加到书签里了

就是这个我们把它挪到上面来

挪到这以后呢我们右键修改

把这个网址改成刚才这个网址

javascript

粘贴过来

然后这里边我们改一下

比如说叫下一个

保存!好大家!看这有一个下一个

那平时不用的时候我会把它隐藏掉

就是 command + shift + B

然后再按一下它就显示出来了

这样然后用的时候呢就点一下

大家看!

这样他就自动切换下一个然后去提交

然后去预览一下

那有了这个思路

我们其实可以做很多事情

比如说我这有一段写好了的脚本哈

我们打开一个 csdn

找一个带代码段的博客

比如说这个我们看有没有

好这个有

然后他现在不能复制

大家看选选中也不行

好点这就让我登录好

然后我们试一下哈

把这一段代码

然后我们把这个网页先收藏一下

然后呢把它拖到上面来

修改一下

javascript:

然后粘过来

然后这呢我们就叫

我要复制

好大家看现在选中不了

没反应!然后复制点的话 它还让我登录

我点下这个按钮

哎这样就可以选了

然后也可以复制了

大家看!复制过来了

好今天就到这里谢谢大家

再见

最后更新于