异步获取元素的脚本库 ElementGetter

cxxjackie

TheWQ 发表于 2023-5-20 11:31
这样写错了吗   
/* global elmGetter */
    // ad-floor-cover ad-report

看起来似乎没错，你是运行遇到什么问题了吗？如果运行也报not defined错误，检查下你的引用地址是否正确，2.0版本才取消的实例化，看看是否引用的旧版本。
另外，如果回调函数相同，选择器可以合并处理：

1. elmGetter.each('.b-img__inner, .ad-floor-cover, .ad-report', document, laji => {
   
2.     laji.style.display='none'
   
3. });

复制代码

脚本体验师001

测试代码

// ==UserScript==
// @name         打开音乐文件夹测试
// @namespace    https://bbs.tampermonkey.net.cn/
// @version      0.1.0
// @description  try to take over the world!
// @author       You
// @match        https://cloud.189.cn/web/main/file/folder/71461113680969543
// @require      https://scriptcat.org/lib/513/2.0.0/ElementGetter.js
// @run-at       document-start
// @grant        unsafeWindow
// ==/UserScript==

(function () {
    'use strict';

    /*
        // 这个成功 {isTrusted: true}
        elmGetter.get('div').then(div => {
            console.log('节点必须有', div);
            loadScript('https://code.jquery.com/jquery-3.6.4.min.js').then(success => {
                console.log('success', success);
                console.log('jQuery：', unsafeWindow?.jQuery?.fn?.jquery || 'loadScript 失败了');
            }, error => {
                console.log('error', error);
            });
        });
    */

    // 这个失败 {isTrusted: false}，script未写入
    elmGetter.get('.p-web-audioplayer').then(div => {
        console.log('节点必须有', div);
        loadScript('https://code.jquery.com/jquery-3.6.4.min.js').then(success => {
            console.log('success', success);
            console.log('jQuery：', unsafeWindow?.jQuery?.fn?.jquery || 'loadScript 失败了');
        }, error => {
            console.log('error', error);
        });
    });

    function loadScript(src) {
        if (!window.instances) {
            window.instances = {};
        }
        if (!window.instances[src]) {
            window.instances[src] = new Promise((resolve, reject) => {
                const script = document.createElement("script")
                script.src = src;
                script.type = "text/javascript";
                script.onload = resolve;
                script.onerror = reject;
                document.head.appendChild(script);
            });
        }
        return window.instances[src];
    };

    // Your code here...
})();

感觉上在 new MutationObserver 之前或者使用 MutationObserver 后尽可能快的写入script标签是成功的
反之无法写入（document.head里没有），直观表现就是返回状态仍是success ，但 isTrusted: false
手写 MutationObserver 触发代码似乎表现也一样的
搞不懂喽，请老师看一下属于什么事故这是

猫和猴子表现也不一样，猫直接没找到节点 @王一之

王一之

脚本体验师001 发表于 2023-6-4 07:10
[md]测试代码
```js
// ==UserScript==

初步排查出来了，脚本猫在这行返回的null

const node = query(false, selector, el, true, curMode);

具体原因我再看看

王一之

脚本体验师001 发表于 2023-6-4 07:10
[md]测试代码
```js
// ==UserScript==

不对，整体的执行逻辑是可以的，问题在于console.log脚本猫没有拿到最原始的console.log，被网页的替换掉了，网页的会屏蔽掉日志内容

这个问题和脚本猫的脚本注入逻辑有关系，后续会进行处理，不过改动可能会稍大

脚本体验师001

王一之 发表于 2023-6-4 12:17
不对，整体的执行逻辑是可以的，问题在于console.log脚本猫没有拿到最原始的console.log，被网页的替换掉 ...

哥哥确实明智
再测试 GM_log 页面会报错，console.info打印正常
console.log这么香的吗，页面都喜欢把console.log牢牢抓在手里像亲的一样
甚至猜测有些还会上报log信息
在我们的猫儿没整好这个之前，需要注意一下这个点

王一之

脚本体验师001 发表于 2023-6-4 13:35
哥哥确实明智
再测试 GM_log 页面会报错，console.info打印正常
console.log这么香的吗，页面都喜欢把con ...

GM_log没问题的哥哥是不是没
// @grant        GM_log

脚本体验师001

王一之 发表于 2023-6-4 18:46

GM_log没问题的哥哥是不是没
// @grant GM_log

![7LD(ZNUOE~Y`HHN}3M]$R1N.png](data/attachment/forum/202306/04/193747ge5f2dia952dsine.png)

GM_log没有输出，还引发了错误

脚本体验师001

1. // ==UserScript==
   
2. // [url=home.php?mod=space&uid=23356]@name[/url]         New Userscript
   
3. // @namespace    https://bbs.tampermonkey.net.cn/
   
4. // @version      0.1.0
   
5. // @description  try to take over the world!
   
6. // @author       You
   
7. // [url=home.php?mod=space&uid=52134]@match[/url]        https://cloud.189.cn/web/main/file/folder/71461113680969543
   
8. // @require      https://scriptcat.org/lib/513/2.0.0/ElementGetter.js
   
9. // @grant        GM_log
   
10. // ==/UserScript==
    
11. 
    
12. (function () {
    
13.     'use strict';
    
14. 
    
15.     GM_log('GM_log运行');
    
16. 
    
17.     elmGetter.get('div').then(div => {
    
18.         GM_log(div);
    
19.     });
    
20. 
    
21.     // Your code here...
    
22. })();

复制代码

王一之

脚本体验师001 发表于 2023-6-4 19:39
[md]![7LD(ZNUOE~Y`HHN}3M\]$R1N.png](data/attachment/forum/202306/04/193747ge5f2dia952dsine.png)![F ...

好像是，不过没有影响，先记录下来了

cxxjackie

脚本体验师001 发表于 2023-6-4 07:10
[md]测试代码
```js
// ==UserScript==

我没这个云盘账号来测试，但大致能推测出原因：第一种情况是因为页面中本身就有div，elmGetter.get几乎是同步的，此时页面中的多数js都未执行；第二种应该是页面js在监听到script插入时手动触发了一个load事件，只有这种isTrusted才会是false，可以用以下代码模拟：

1. elmGetter.each('script', script => {
   
2.     script.dispatchEvent(new Event('load'));
   
3. });

复制代码

onload实际发生了多次，只是由于Promise的机制，第一次resolve后就忽略了后面的，所以造成回调函数提早触发了，改成这样应该就能解决问题：

1. script.onload = e => e.isTrusted && resolve(e);

复制代码