// ==UserScript== // @name 开发助手-添加边框 // @namespace http://tampermonkey.net/SRworks // @version 0.1.3 // @description 开发时。给网页元素添加阴影。看到div的宽高。 // @author 侠客s // @match http://localhost/* // @match http://localhost* // @match http://127.0.0.1* // @match http://127.0.0.1/* // @icon https://img1.baidu.com/it/u=3500124600,200769604&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500 // @grant none // @license MIT // @downloadURL none // ==/UserScript== (function() { 'use strict'; function pressShow() { const els = document.querySelectorAll("div"); for (let item of els) { item.style.boxShadow = "2px 4px 8px gray"; } div.innerText = "隐藏"; Switch++; } function pressHidden() { const els = document.querySelectorAll("div"); for (let item of els) { item.style.boxShadow = ""; } div.innerText = "显示"; Switch++; } const div = document.createElement("button"); div.innerText = "显示"; document.body.appendChild(div); div.style.width = "5rem"; div.style.height = "2rem"; div.style.cursor = "pointer"; div.style.background = "rgba(255, 99, 71)"; div.style.opacity = .4; div.style.borderRadius = "10%"; div.style.position = "absolute"; div.style.top = "0"; div.style.fontSize = "1rem"; div.style.fontWeight = "800"; div.style.color = "#fff"; let Switch = 0; div.addEventListener("click", (el) => { if (Switch % 2 == 0) { pressShow() } else { pressHidden() } }); window.onload = () => { pressShow() } })();