“Userscript”的版本间的差异

来自Gea-Suan Lin's Wiki
跳到导航 跳到搜索
(创建页面,内容为“== 範例 == 對於SPA類常用的方式,聽HTML元素的事件: <syntaxhighlight lang="javascript"> let ob = new window.MutationObserver(events => {…”)
 
 
(未显示同一用户的6个中间版本)
第1行: 第1行:
 +
'''Userscript'''是一個讓開發者更容易操作(與修改)網頁的方式,通常是以[[JavaScript]]撰寫。
 +
 +
== 軟體 ==
 +
 +
目前推薦使用開源的[[Violentmonkey]],支援[[Chromium]]系列瀏覽器,以及[[Firefox]]瀏覽器。
 +
 
== 範例 ==
 
== 範例 ==
  
 對於SPA類常用的方式,聽HTML元素的事件:
+
=== SPA ===
 +
 
 +
 對於SPA類常用的方式,聽HTML元素的事件 (這邊是聽<code>document</code>元素,可以自己考慮聽更小的範圍)
  
 
<syntaxhighlight lang="javascript">
 
<syntaxhighlight lang="javascript">
   let ob = new window.MutationObserver(events => {
+
let ob = new window.MutationObserver(events => {
     events.forEach(ev => {
+
   events.forEach(ev => {
       ev.addedNodes.forEach(node => {
+
     ev.addedNodes.forEach(node => {
       });
 
 
      });
 
      });
 
    });
 
    });
 +
});
  
   ob.observe(document, {
+
ob.observe(document, {
     childList: true,
+
   childList: true,
     subtree: true,
+
   subtree: true,
   });
+
});
 
</syntaxhighlight>
 
</syntaxhighlight>
 +
 +
== 外部連結 ==
 +
 +
* https://en.wikipedia.org/wiki/Userscript
 +
 +
=== Hosting ===
 +
 +
* https://greasyfork.org/
 +
* https://openuserjs.org/
 +
* https://sleazyfork.org/

2021年5月3日 (一) 10:25的最新版本

Userscript是一個讓開發者更容易操作(與修改)網頁的方式,通常是以JavaScript撰寫。

軟體

目前推薦使用開源的Violentmonkey,支援Chromium系列瀏覽器,以及Firefox瀏覽器。

範例

SPA

對於SPA類常用的方式,聽HTML元素的事件(這邊是聽document元素,可以自己考慮聽更小的範圍):

let ob = new window.MutationObserver(events => {
    events.forEach(ev => {
        ev.addedNodes.forEach(node => {
        });
    });
});

ob.observe(document, {
    childList: true,
    subtree: true,
});

外部連結

Hosting