Chrome插件开发 - Modify images on the page

这篇文章将解释如何修改活动页面上的图片

<video
autoPlay
src="https://cdn.jsdelivr.net/gh/manonicu/pics@master/uPic/spoof-images_xjwqgo.webm"

修改src/App.jsx

import React from 'react'

export default function ChangeImages() {
  // 获取活动页面所有图片
  const spoofImages = () => {
    const images = document.getElementsByTagName('img')
    for (const image of images) {
      image.removeAttribute('srcset') //去掉srcset，使srcset高质量图片失效
      image.src = 'http://placekitten.com/300'
    }
  }
  // 通过chrome钩子替换活动页面所有图片
  const imageSpoof = async () => {
    const [tab] = await chrome.tabs.query({active: true, currentWindow: true})
    chrome.scripting.executeScript({
      target: {tabId: tab.id},
      function: spoofImages
    })
  }
  return <button onClick={imageSpoof}>Change images</button>
}