🎉 欢迎访问GreasyFork.Org 镜像站!本镜像站由公众号【爱吃馍】搭建,用于分享脚本。联系邮箱📮

Greasy fork 爱吃馍镜像

Greasy Fork is available in English.

📂 缓存分发状态(共享加速已生效)
🕒 页面同步时间:2026/01/11 18:11:00
🔄 下次更新时间:2026/01/11 19:11:00
手动刷新缓存

workflowy-img

Automatically render pictures in workflowy

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey, Greasemonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Userscripts.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een gebruikersscriptbeheerder nodig.

(Ik heb al een user script manager, laat me het downloaden!)

🚀 安装遇到问题?关注公众号获取帮助

公众号二维码

扫码关注【爱吃馍】

回复【脚本】获取最新教程和防失联地址

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

(Ik heb al een beheerder - laat me doorgaan met de installatie!)

🚀 安装遇到问题?关注公众号获取帮助

公众号二维码

扫码关注【爱吃馍】

回复【脚本】获取最新教程和防失联地址

// ==UserScript==
// @name         workflowy-img
// @namespace    https://github.com/zkytech/Tampermonkey_scripts
// @version      0.0.2
// @description  Automatically render pictures in workflowy
// @author       zkytech
// @include      *://workflowy.com*
// @grant        none1
// ==/UserScript==

(function () {
  "use strict";
  const regexpImgUrl = /http[s]?:\/\/.*\.(jpg|png|ico|gif|jpeg)(\?.*)?/i;
  function refreshImgs() {
    // make sure all img url exists in contentLink
    document
      .querySelectorAll("img.workflowy-img-generated-img-element")
      .forEach((imgElement) => {
        const UUID = imgElement.id.replace(/^img/, "link");
        const link = document.getElementById(UUID);
        if (
          link &&
          link.href != imgElement.src &&
          regexpImgUrl.test(link.href)
        ) {
          imgElement.src = link.href;
        } else if (!link) {
          // img url text has been deleted
          imgElement.remove();
        }
      });

    // make sure all contentLink has been rendered
    document.querySelectorAll("a.contentLink").forEach((link) => {
      if (
        link.href &&
        regexpImgUrl.test(link.href) &&
        !link.getAttribute("workflowy-img-rendered")
      ) {
        const UUID = crypto.randomUUID();
        const imgElement = document.createElement("img");
        imgElement.src = link.href;
        imgElement.id = "img" + UUID;
        imgElement.className = "workflowy-img-generated-img-element";

        link.parentElement.parentElement.parentElement.parentElement.appendChild(
          imgElement
        );
        link.setAttribute("workflowy-img-rendered", true);
        link.id = "link" + UUID;
      } else if (link.id && link.getAttribute("workflowy-img-rendered")) {
        const UUID = link.id.replace(/^link/, "img");
        const imgElement = document.getElementById(UUID);
        if (imgElement.src != link.href) {
          // img url change
          if (regexpImgUrl.test(link.href)) {
            // if new url is still img, update <img> element
            imgElement.src = link.href;
          } else {
            // new url is not img, remove <img> element
            imgElement.remove();
            link.removeAttribute("id");
            link.removeAttribute("workflowy-img-rendered");
          }
        }
      }
    });
  }
  // refresh all img when dom change
  const observer = new MutationObserver(function (mutations, observer) {
    console.log("refreshing img");
    refreshImgs();
  });
  const el = document.querySelector("body");
  const options = {
    childList: true,
    attributes: false,
    subtree:true
  };
  observer.observe(el, options);
})();