猴油脚本使用

猴油脚本 据说是使用最多的插件，作为一个前端必须得玩一下

语法： 官方文档

弄了两个小脚本，可以运行，后面有空持续更新
1、美化页面滚动条

// ==UserScript==
// @name         美化页面滚动条
// @namespace    老程
// @version      0.1
// @description  美化页面滚动条
// @author       老程
// @match        http*://*/*
// @icon         https://wiki.greasespot.net/favicon.ico
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    function main() {
        console.log('-----老程美化滚动条')
        var styleTag = document.createElement('style')
        styleTag.setAttribute('type', 'text/css')
        styleTag.setAttribute('id', 'pretty-scrollbar')
        document.head.appendChild(styleTag)
        styleTag.innerText = `
        ::-webkit-scrollbar {
            width: 8px;
            height: 8px;
            opacity: 0;
            -webkit-transition: opacity .12s ease-in-out;
            transition: opacity .12s ease-in-out;
        }
        ::-webkit-scrollbar-thumb {
            border-radius: 4px;
            background-color: rgba(144,147,153,.3);
            -webkit-transition: background-color .3s;
            transition: background-color .3s;
        }
        `
    }
    main()
    function urlChange(){
        var _wr = function(type) {
        var orig = history[type]
        return function() {
            var rv = orig.apply(this, arguments)
            var e = new Event(type)
            e.arguments = arguments
            window.dispatchEvent(e)
            return rv
        }
        }
        history.pushState = _wr('pushState')
        history.replaceState = _wr('replaceState')

        window.addEventListener('replaceState', function (e) {
            console.log('监听到页面url变化，重新美化滚动条')
            setTimeout(()=>{main()},500)
        })
        window.addEventListener('pushState', function (e) {
            console.log('监听到页面url变化，重新美化滚动条')
            setTimeout(()=>{main()},500)
        })
    }
    if(location.hostname == "www.baidu.com"){ urlChange() }



})();

使用前后对比效果如下，

2、屏蔽指定广告

// ==UserScript==
// @name         屏蔽指定广告
// @namespace    老程
// @version      0.1
// @description  屏蔽指定广告
// @author       老程
// @match        http*://*/*
// @icon         https://wiki.greasespot.net/favicon.ico
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    function main(){
        var totalCount = 0
        if(location.hostname == "www.baidu.com"){
            try {
                document.querySelector('#head #u1').style.display = 'none'
                totalCount++
            } catch (error) {}
            try {
                document.querySelector('#s-hotsearch-wrapper').style.display = 'none'
                totalCount++
            } catch (error) {}
            try {
                document.querySelector('#content_right').style.display = 'none'
                totalCount++
            } catch (error) {}
            try {
                document.querySelector('.head_wrapper #u').style.display = 'none'
                totalCount++
            } catch (error) {}
            try {
                document.querySelector('#s_side_wrapper').style.display = 'none'
                totalCount++
            } catch (error) {}
            try {
                document.querySelector('#s-top-left').style.display = 'none'
                totalCount++
            } catch (error) {}
            try {
                document.querySelector('#bottom_layer').style.display = 'none'
                totalCount++
            } catch (error) {}
        }
        if(location.hostname == "blog.csdn.net"){
            try {
                document.querySelector('.csdn-side-toolbar').style.display = 'none'
                totalCount++
            } catch (error) {}
        }
        console.log('-----老程共为您屏蔽了条 ',totalCount,' 指定广告')
    }
    main()

    function urlChange(){
        var _wr = function(type) {
        var orig = history[type]
        return function() {
            var rv = orig.apply(this, arguments)
            var e = new Event(type)
            e.arguments = arguments
            window.dispatchEvent(e)
            return rv
        }
        }
        history.pushState = _wr('pushState')
        history.replaceState = _wr('replaceState')

        window.addEventListener('replaceState', function (e) {
            console.log('监听到页面url变化，重新美化滚动条')
            setTimeout(()=>{main()},500)
        })
        window.addEventListener('pushState', function (e) {
            console.log('监听到页面url变化，重新美化滚动条')
            setTimeout(()=>{main()},500)
        })
    }
    if(location.hostname == "www.baidu.com"){ urlChange() }

    // Your code here...
})();

效果对比如下

使用后，一览无余（脚本待优化，应该加 css 样式）

2、鼠标悬停旋转图片

// ==UserScript==
// @name         转的飞起
// @namespace    老程
// @version      0.1
// @description  图片：你看我转的多快
// @author       老程
// @match        http*://*/*
// @icon         https://wiki.greasespot.net/favicon.ico
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    function main(isBaidu) {
        console.log('-----老程旋转图片')
        var styleTag = document.createElement('style')
        styleTag.setAttribute('type', 'text/css')
        styleTag.setAttribute('id', 'pretty-scrollbar')
        document.head.appendChild(styleTag)
        // styleTag.innerText = `img${!isBaidu?':hover':''} {
        styleTag.innerText = `img:hover {
           transform: rotate(666turn) !important;
           transition-delay: 1s !important;
           transition-property: all !important;
           transition-duration: 59s !important;
           transition-timing-function: cubic-bezier(.34,0,.84,1) !important;
           cursor:pointer;
        }`
    }
    function urlChange(isBaidu){
        main(isBaidu)
        var _wr = function(type) {
        var orig = history[type]
        return function() {
            var rv = orig.apply(this, arguments)
            var e = new Event(type)
            e.arguments = arguments
            window.dispatchEvent(e)
            return rv
        }
        }
        history.pushState = _wr('pushState')
        history.replaceState = _wr('replaceState')

        window.addEventListener('replaceState', function (e) {
            console.log('监听到页面url变化，重新旋转图片')
            setTimeout(()=>{main(isBaidu)},1000)
        })
        window.addEventListener('pushState', function (e) {
            console.log('监听到页面url变化，重新旋转图片')
            setTimeout(()=>{main(isBaidu)},1000)
        })
    }
    urlChange(location.href.includes('baidu'))
})();