javascript - 使用 GM_xmlhttpRequest 获取多个外部 URL，将页面 <H1> 添加到链接？

Question

感谢 Hellion 的帮助，已解决!

代码如下:

// ==UserScript==
// @name          Facebook Comment Moderation Links
// @description   Appends story titles to Facebook Comment Moderation "Visit Website" links
// @include       http*://developers.facebook.com/tools/*
// ==/UserScript==

var allLinks, thisLink, expr, pageTitle, myURL, myPage, pageContent, title;

// grabbing URLs
function fetchPage(myPage, targetLink) {
        GM_xmlhttpRequest({
            method: 'GET',
            url: myPage,
            onload: function(response){

                // get the HTML content of the page
                pageContent = response.responseText;

                // use regex to extract its h1 tag
                pageTitle = pageContent.match(/<h1.*?>(.*?)<\/h1>/g)[0];

                // strip html tags from the result
                pageTitle = pageTitle.replace(/<.*?>/g, '');

                // append headline to Visit Website link
                title = document.createElement('div');
                title.style.backgroundColor = "yellow";
                title.style.color = "#000";
                title.appendChild(document.createTextNode(pageTitle));
                targetLink.parentNode.insertBefore(title, targetLink.nextSibling);  

            }
        }); 
}


function processLinks() {

    // define which links to look for
    expr = "//a[contains (string(), 'Visit Website')]";
    allLinks = document.evaluate(
        expr,
        document,
        null,
        XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
        null);

    // loop through the links
    for (var i = 0; i < allLinks.snapshotLength; i++) {
        thisLink = allLinks.snapshotItem(i);    
        myURL = thisLink.getAttribute('href');

        // follow Visit Website link and attach corresponding headline
        fetchPage(myURL, thisLink);
    }
}

// get the ball rolling
processLinks();

--- 下面是较早的内容 ---

我正在尝试制作一个 Greasemonkey 脚本，该脚本从一组链接中的每一个中获取 URL，并将页面的 h1 标记的内容附加到链接的末尾。

到目前为止，我可以让它显示 URL 本身，这不需要页面请求，但不需要页面的 h1 标记内容。

我从该站点上的其他问题了解到 GM_xmlhttpRequest 是异步的，我很确定这至少是部分原因。但是我找不到这个特定问题的解决方案。

下面是我目前的代码。它适用于 Facebook 的网站评论审核工具——在版主视图中，每条评论都有一个链接“访问网站”，可将您带到评论所在的文章。

正如现在所写的那样，它会附加 HTTP 状态代码，而不是页面标题，然后是每个“访问网站”链接的 URL。状态代码部分只是一个占位符。我计划添加 HTML 解析等，以便稍后获取 h1 标签。

现在我只是想让 GM_xmlhttpRequest 和内容插入相匹配。

如能帮助解决此问题，我们将不胜感激。谢谢!

var allLinks, thisLink, expr, pageTitle, myURL, pageContent, title;

// define which links to process
    expr = "//a[contains (string(), 'Visit Website')]";
    allLinks = document.evaluate(
        expr,
        document,
        null,
        XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
        null);

// cycle through links
for (var i = 0; i < allLinks.snapshotLength; i++) {

    thisLink = allLinks.snapshotItem(i);    
    myURL = thisLink.getAttribute('href');

    GM_xmlhttpRequest({
        method: 'GET',
        url: myURL,
        onload: function(responseDetails){

            pageTitle = responseDetails.status;

        }
    });

    // append info to end of each link 
    title = document.createElement('div');
    title.style.backgroundColor = "yellow";
    title.style.color = "#000";
    title.appendChild(document.createTextNode(
        ' [' + pageTitle + ' - ' + thisLink.getAttribute('href') + ']'));
    thisLink.parentNode.insertBefore(title, thisLink.nextSibling);  

}

Answer 1

如其所写，是的，您遭受了 GM_xmlhttpRequest() 调用的异步性质的困扰。循环将触发并开始获取所有 pageTitle 值，但会立即继续，而不是等待请求完成，因此 pageTitle(顺便说一下，您没有在任何地方声明)在您使用它时为 null文本节点。

要纠正这种情况，您需要采取的第一步是将当前跟在 GM_xmlhttpRequest() 调用之后的所有内容移动到 onload: function()< 的内部 定义。然后，只有在检索到每个页面后，您才能继续修改链接。 (可能还有其他问题需要传入或重新获取 thislink 值，我不确定。)