FUCKADS/广告标记去除

标记去处sb广告和丑不拉几不想看到的网页元素
换行
// ==UserScript==
// @name         FUCKADS/广告标记去除
// @namespace    http://tampermonkey.net/
// @version      1.1
// @description  标记去处sb广告和丑不拉几不想看到的网页元素
// @author       Gwen
// @license      MIT
// @match        *://*/*
// @grant        unsafeWindow
// @run-at       document-body
// @homepageURL  https://gf.qytechs.cn/zh-CN/scripts/473294-ads-%E5%B9%BF%E5%91%8A%E6%A0%87%E8%AE%B0%E5%8E%BB%E9%99%A4
// ==/UserScript==

(function() {
  'use strict';

  console.fuck = function(content) {
    console.log('%c' + content, 'color:blue')
  }
  var savedRules = []
  var isSelected = false
  var isMaskShow = true
  var lastSelectedElement = null
  loadRules()
  const overlay = document.createElement('div');
  overlay.style.position = 'fixed';
  overlay.style.top = '0';
  overlay.style.left = '0';
  overlay.style.width = '100%';
  overlay.style.height = '100%';
  overlay.style.background = 'rgba(0, 0, 0, 0.5)';
  overlay.style.zIndex = '999999999999';
  document.body.append(overlay);
  const notice = document.createElement('div')
  notice.innerText = '点击网页元素进行选择'
  notice.style.position = 'fixed';
  notice.style.bottom = '50px';
  notice.style.left = '20px';
  notice.style.zIndex = '1000000999999';
  notice.style.fontSize = '18px';
  notice.style.fontWeight = '550';
  notice.style.color = 'rgb(245, 245, 245)'
  notice.style.pointerEvents = 'none';
  document.body.append(notice)
  const tools = document.createElement('div')
  tools.style.position = 'fixed';
  tools.style.bottom = '0';
  tools.style.left = '20px';
  tools.style.zIndex = '1000000999999';
  const buttonStyle = `background-color: #4CAF50;border: none;color: white;padding: 10px 20px;text-align: center;text-decoration: none;display: inline-block;font-size: 16px;margin: 4px 2px;cursor: pointer;border-radius: 4px;`;
  const selectParentButton = createButton("选择父元素", e => {
    if (!lastSelectedElement) {
      alert('请先点击一个网页元素')
      return
    }
    if (!lastSelectedElement.parentElement || lastSelectedElement.parentElement == document.body) {
      alert('父元素不存在')
      return
    }
    clearRectangles()
    draw(lastSelectedElement.parentElement)
    console.log('选择', lastSelectedElement.parentElement)
    lastSelectedElement = lastSelectedElement.parentElement
  });
  const toggleButton = createButton("隐藏/显示", e => {
    if (!lastSelectedElement) {
      alert('请先点击一个网页元素')
      return
    }
    let sameClassElements = []
    if (lastSelectedElement.className) {
      sameClassElements = document.getElementsByClassName(lastSelectedElement.className)
    }
    if (!lastSelectedElement.style.display || lastSelectedElement.style.display != 'none') { //隐藏元素
      lastSelectedElement.style.display = 'none'
      for (let elem of sameClassElements) {
        elem.style.display = 'none'
      }
    } else { //显示元素
      let originalDisplayType = lastSelectedElement.getAttribute('display-type')
      lastSelectedElement.style.display = originalDisplayType
      for (let elem of sameClassElements) {
        elem.style.display = originalDisplayType
      }
    }
  });
  const removeButton = createButton("移除", e => {
    if (!lastSelectedElement) {
      alert('请先点击一个网页元素')
      return
    }
    let record = confirm('下次进入页面是否阻止其显示？\nSelector: ' + getSelectorPath(lastSelectedElement))
    if (record) {
      savedRules.push(getSelectorPath(lastSelectedElement))
      saveRules()
    }
    if (lastSelectedElement.className) {
      let sameClassElements = document.querySelectorAll(getSelectorPath(lastSelectedElement))
      for (let sameClassElement of sameClassElements) {
        sameClassElement.remove()
      }
    } else {
      lastSelectedElement.remove();
    }
    clearRectangles();
  });
  const showRuleBoxButton = createButton("已记录元素", e => {
    if (ruleBox.style.display != 'none') {
      ruleBox.style.display = 'none'
    } else {
      ruleBox.style.display = 'block'
    }
  })
  const exitButton = createButton("退出", e => {
    overlay.style.display = 'none';notice.style.display = 'none';tools.style.display = 'none';ruleBox.style.display = 'none';
    menuButton.style.display = 'block';
    clearRectangles()
    lastSelectedElement = null
  });
  tools.append(selectParentButton)
  tools.append(toggleButton)
  tools.append(removeButton)
  tools.append(showRuleBoxButton)
  tools.append(exitButton)
  document.body.append(tools)
  function createButton(text, clickHandler) {
    const button = document.createElement("button");
    button.textContent = text;
    button.addEventListener("click", clickHandler);
    button.style = buttonStyle
    return button;
  }

  const ruleBox = document.createElement('div')
  ruleBox.style = "position:fixed;bottom:60px;right:10px;z-index:1000000999999;max-height:200px;overflow:auto;"
  ruleBox.title = '已存储的广告元素标识'
  document.body.append(ruleBox)
  function createRuleItem(rule) {
    const ruleItem = document.createElement("div");
    ruleItem.style = 'background-color:rgba(241,241,241,0.4);padding:5px;margin-bottom:5px;display:flex;align-items:center;width:200px;';
    const ruleText = document.createElement("span");
    ruleText.style = 'flex-grow:1;word-break:break-all;color:aquamarine';
    ruleText.textContent = rule;
    ruleItem.appendChild(ruleText);
    const deleteButton = document.createElement("button");
    deleteButton.style = 'width:20px;height:20px;line-height:20px;text-align:center;background-color:#ccc;color:#fff;border:none;cursor:pointer;';
    deleteButton.className = "delete-button";
    deleteButton.textContent = "×";
    deleteButton.addEventListener("click", () => {
      if (!confirm('是否删除该条规则？')) {
        return
      }
      const index = savedRules.indexOf(rule);
      if (index !== -1) {
        savedRules.splice(index, 1);
        ruleItem.remove();
        saveRules()
      }
    });
    ruleItem.appendChild(deleteButton);
    return ruleItem;
  }

  function renderRuleBox() {
    ruleBox.innerHTML = "";
    savedRules.forEach(rule => {
      const ruleItem = createRuleItem(rule);
      ruleBox.appendChild(ruleItem);
    });
  }
  renderRuleBox();

  const menuButton = document.createElement('div')
  menuButton.style = 'position:fixed;z-index:100000000000;right:0;top:150px;width:40px;height:40px;line-height:40px;text-align:center;border-radius:50%;background:red;color:white;font-weight:550;cursor:pointer'
  menuButton.textContent = '去广告'
  menuButton.addEventListener('click', e => {
    overlay.style.display = 'block';notice.style.display = 'block';tools.style.display = 'block';ruleBox.style.display = 'block';
    menuButton.style.display = 'none'
  })
  document.body.append(menuButton)
  overlay.style.display = 'none';notice.style.display = 'none';tools.style.display = 'none';ruleBox.style.display = 'none';
  menuButton.style.display = 'block'

  const highlightedRectangles = [];
  function loadRules() {
    let storage = localStorage.getItem('fuckads')
    if (storage) {
      savedRules = JSON.parse(storage)
    }
  }
  function saveRules() {
    localStorage.setItem('fuckads', JSON.stringify(savedRules))
  }

  function getSelectorPath(element) {
    if (!(element instanceof Element)) return;
    const originalElement = element
    const path = [];
    let className = element.className
    while (element.parentNode) {
      let selector = element.tagName.toLowerCase();
      if (element.id && isNaN(element.id)) {
        selector += `#${element.id}`;
        path.unshift(selector);
        break;
      } else if (element.className && element.className.trim().length != 0) {
        let elementClassName = element.className.trim()
        if (elementClassName.indexOf('[') != -1 && className) {
          const siblings = Array.from(element.parentNode.children);
          const index = siblings.indexOf(element) + 1;
          selector += `:nth-child(${index})`;
          path.unshift(selector);
        } else {
          if (element == originalElement) { //如果是目标元素，有class就赶紧记录他的class
            selector += '.' + elementClassName.replace(/\s+/g, '.')
            path.unshift(selector);
          } else if (elementClassName.indexOf(' ') == -1) { //不是目标元素，class太复杂就不要了
            selector += `.${elementClassName}`;
            path.unshift(selector);
          }
        }
      } else if (!className) {
        const siblings = Array.from(element.parentNode.children);
        const index = siblings.indexOf(element) + 1;
        selector += `:nth-child(${index})`;
        path.unshift(selector);
      }
      element = element.parentNode;
    }
    return path.join(' ');
  }

  function getElementLeft(element){
　　var actualLeft = element.offsetLeft;
　　var current = element.offsetParent;

　　while (current !== null){
　　　　actualLeft += current.offsetLeft;
　　　　current = current.offsetParent;
　　}

    return actualLeft;
  }

　function getElementTop(element){
　　var actualTop = element.offsetTop;
　　var current = element.offsetParent;

　　while (current !== null){
　　　actualTop += current.offsetTop;
　　　current = current.offsetParent;
　　}
　　return actualTop;
　}

  function draw(element) {
    drawRectangle(element)
    if (element.className) {
      let sameClassElements = document.querySelectorAll(getSelectorPath(element))
      for (let sameClassElement of sameClassElements) {
        if (element == sameClassElement)
          continue
        drawRectangle(sameClassElement, 'yellow')
      }
    }
  }

  function drawRectangle(element, color = 'skyblue') {
    element.setAttribute('display-type', element.style.display)
    const rect = element.getBoundingClientRect();
    const rectangle = document.createElement('div');
    let elementPosition = getComputedStyle(element).position
    if (elementPosition == 'fixed') {
      rectangle.style.position = 'fixed'
    } else {
      rectangle.style.position = 'absolute'
    }
    rectangle.style.zIndex = '999999'
    rectangle.style.boxShadow = color + ' 0 0 5px 5px'
    rectangle.style.boxSizing = 'border-box';
    rectangle.style.top =  getElementTop(element) + 'px';
    rectangle.style.left = getElementLeft(element) + 'px';
    rectangle.style.width = element.offsetWidth + 'px';
    rectangle.style.height = element.offsetHeight + 'px';
    rectangle.style.background = 'rgba(0,255,0,0.3)'
    rectangle.style.pointerEvents = 'none'
    document.body.append(rectangle);
    highlightedRectangles.push(rectangle);
  }

  function clearRectangles() {
    for (const rectangle of highlightedRectangles) {
        rectangle.remove();
    }
    highlightedRectangles.length = 0;
  }

  overlay.addEventListener('click', event => {
    event = event || window.event;
    event.preventDefault ? event.preventDefault() : (event.retrunValue = false) ;
    event.stopPropragation ? event.stopPropragation() : (event.cancelBubble = true)
    const x = event.clientX;
    const y = event.clientY;
    overlay.style.pointerEvents = 'none'
    const element = document.elementFromPoint(x, y);
    overlay.style.pointerEvents = 'all'
    if (element && element !== overlay) {
      console.fuck(getSelectorPath(element))
      if (element != lastSelectedElement) {
        clearRectangles()
        draw(element)
        lastSelectedElement = element
      }
    }
  })

  const observer = new MutationObserver((mutationsList, observer) => {
    for (let mutation of mutationsList) {
      if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
        mutation.addedNodes.forEach(node => {
          if (node.nodeType === Node.ELEMENT_NODE) {
            const isAdElement = savedRules.some(selector => node.matches(selector));
            if (isAdElement) {
              console.log('发现广告元素:', node);
              node.remove()
            }
          }
        });
      }
    }
  });
  const observerConfig = { childList: true, subtree: true };
  observer.observe(document.documentElement, observerConfig);

  // function fuckEmAll(number) {
  //   if (number <= 0)
  //     return
  //   for (let rule of savedRules) {
  //     try {
  //       let elems = document.querySelectorAll(rule)
  //       for (let elem of elems) {
  //         elem.remove()
  //       }
  //     } catch(err) {
  //       console.error(err)
  //     }
  //   }
  //   setTimeout(fuckEmAll(number - 1), 100)
  // }
  // setInterval
  window.onload = function(e) {
    for (let rule of savedRules) {
      try {
        let elems = document.querySelectorAll(rule)
        for (let elem of elems) {
          elem.remove()
        }
      } catch(err) {
        console.error(err)
      }
    }
  }
  // fuckEmAll(100)
})();
欢迎访问Greasy Fork镜像
