9行代码制作一个简单的油猴插件

相信许多同学都有用过油猴这个谷歌插件吧,还没有了解过的朋友也可以去谷歌应用商店安装试一下,真的是一款非常牛逼的插件,强力推荐!!!
今天我就和大家分享怎么用油猴自己来写一个简单的脚本吧。我要实现的是就是在原有百度搜索的下方增加一个时间展示。效果图如下:


展示图

那么我们一起开始制作:
1.第一步:安装好油猴插件,谷歌应用商店搜索Tampermonkey即可找到(已安装的朋友可以忽略)
2.第二步:点击浏览器右上角的油猴小图标打开控制面板


image.png

3.第三步:在控制面板中新建脚本
image.png

4.第四步:修改基本配置,主要是@match一定要是指定脚本生效的网址
image.png

5.第五步:写我们的代码

    var divs = document.getElementById("head_wrapper");
    var newDiv = document.createElement("div");
    newDiv.setAttribute("style","height:300px;width:640px;position:relative;left:180px;line-height:300px;");
    divs.appendChild(newDiv);
    var timeLabel = document.createElement("p")
    newDiv.appendChild(timeLabel)
    timeLabel.setAttribute("style","color:#1ABC9C;font-size:60px;")
    var date = new Date();
    timeLabel.innerHTML = date.toLocaleString();

6.第六步:保存就ok了,去重新刷新下你的百度搜索(www.baidu.com)你就会发现他的变化了。

你可能感兴趣的:(9行代码制作一个简单的油猴插件)