Javascript解析Reddit评论页面中的用户名

我正在为一个Sub-reddit开发一个bookmarklet，我试图获取评论页面上的所有用户名，这样我就可以解析它们，然后回来更新它们旁边的信息，类似于RES所做的。每个注释的作者都有一个前缀为author的类，但在类名的末尾有不同的内容。我该如何获取所有的用户名

那么一旦我有了这个列表，我将如何用一个额外的图标来更新每个列表呢

任何做类似事情的建议/教程都会很好

编辑：我不确定在不给出大量块的情况下，标记的哪些部分会有用。下面是我在Javascript子Reddit中提出的相同问题

您应该能够检查name元素并查看我正在使用的内容

目前正在处理此问题：

---

因此，我有一个Hello World风格的Bookmarklet，它可以检查Jquery并在不存在时加载它，然后抛出一个警报

快速查看您在问题中链接到的页面，似乎用户名周围的标记如下（大概以您的用户名为例）：

这两种方法都将

img

放在

a

元素中。如果要将其放在

元素之前，只需使用：

var authors = [];

$('a.author').html(
    function(i, h) {
        var authorName = $(this).text();
        if ($.inArray(authorName, authors) == -1) {
            authors.push(authorName); // an array of author-names
        }
        return '<img src="path/to/' + encodeURIComponent(authorName) + '-image.png" / >' + h;
    });

console.log(authors);

// creates an 'authors' variable, and sets it to be an array.
var authors = [];

$('a.author').each( // iterates through each element returned by the selector
    function() {
        var that = this, // caches the this variable, rather than re-examining the DOM.
            // takes the href of the current element, splits it on the '/' characters,
            // and returns the *last* of the elements from the array formed by split()
            authorName = that.href.split('/').pop();

        // looks to see if the current authorName is in the authors array, if it *isn't*
        // the $.inArray returns -1 (like indexOf())
        if ($.inArray(authorName, authors) == -1) {
            // if authorName not already in the array it's added to the array using
            // push()
            authors.push(authorName);
        }

        // creates an image element, concatenates the authorName variable into the
        // src attribute-value
        $('<img src="http://www.example.com/path/to/' + authorName+ '-image.png" />')
            // inserts the image before the current (though converted to a jQuery
            // object in order to use insertBefore()
            .insertBefore($(that));
    });

console.log(authors);
​

//创建“authors”变量，并将其设置为数组。
var=[]；
$（'a.author'）。每个（//遍历选择器返回的每个元素
函数（）{
var that=this，//缓存该变量，而不是重新检查DOM。
//获取当前元素的href，将其拆分为“/”字符，
//并返回由split（）形成的数组中的*最后*个元素
authorName=that.href.split（'/'）.pop（）；
//查看当前authorName是否在authors数组中，如果*不在*
//$.inArray返回-1（与indexOf（）类似）
if（$.inArray（authorName，authors）=-1）{
//如果authorName不在数组中，则使用将其添加到数组中
//推
authors.push（authorName）；
}
//创建图像元素，将authorName变量连接到
//src属性值
$('')
//在当前图像之前插入图像（尽管已转换为jQuery）
//对象以使用insertBefore（）
.insertBefore（$（that））；
});
console.log（作者）；
​


参考资料：





您能举一个包含作者姓名的标记示例吗（对于我们这些人，包括我在内，他们从未访问过Reddit或检查过源代码）？你对bookmarklet有多了解？你目前有没有可用的代码？@DavidThomas提供了更多的信息。不确定有多少标记会有帮助，所以链接到一个评论线程，以便你可以查看。谢谢你的帮助！哇。太棒了！我正在使用最后一个。你能给我解释一下这是如何工作的吗，我的JS skill缺乏？事实上，刚刚发现了一个问题——侧边栏中的MOD也被标记为作者，尽管他们没有发表评论。这不是世界末日，但如果可能的话，应该避免尴尬的行为。有什么想法吗？还有一个JSON提要可用，但第二次请求页面似乎很奇怪。如果你添加.js在页面URL的末尾，您可以看到JSON格式的页面。这很容易解析，但从资源的角度来看，这似乎是一个奇怪的想法。更新了答案，并解释了最终代码块的工作原理。要解决侧栏中的mods问题，只需修改初始jQuery选择器，使其仅针对co中的
a
元素内容（
$（“#主内容a”）…
例如，使用基于
id
的示例）。
var authors = [];

$('a.author').html(
    function(i, h) {
        var authorName = this.href.split('/').pop();
        if ($.inArray(authorName, authors) == -1) {
            authors.push(authorName);
        }
        return '<img src="http://www.example.com/path/to/' + authorName+ '-image.png" />' + h;
    });

console.log(authors);

// creates an 'authors' variable, and sets it to be an array.
var authors = [];

$('a.author').each( // iterates through each element returned by the selector
    function() {
        var that = this, // caches the this variable, rather than re-examining the DOM.
            // takes the href of the current element, splits it on the '/' characters,
            // and returns the *last* of the elements from the array formed by split()
            authorName = that.href.split('/').pop();

        // looks to see if the current authorName is in the authors array, if it *isn't*
        // the $.inArray returns -1 (like indexOf())
        if ($.inArray(authorName, authors) == -1) {
            // if authorName not already in the array it's added to the array using
            // push()
            authors.push(authorName);
        }

        // creates an image element, concatenates the authorName variable into the
        // src attribute-value
        $('<img src="http://www.example.com/path/to/' + authorName+ '-image.png" />')
            // inserts the image before the current (though converted to a jQuery
            // object in order to use insertBefore()
            .insertBefore($(that));
    });

console.log(authors);
​