0

我正在为 Sub reddit 制作一个书签,我正在尝试获取评论页面上的所有用户名,以便我可以解析它们,然后返回并更新它们旁边的信息,类似于 RES 所做的。每个评论的作者都有一个以 Author 为前缀的类,但在类名的末尾有不同的内容。我将如何获取所有用户名?

然后,一旦我有了列表,我将如何使用附加图标来更新每个列表?

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

编辑:我不太确定标记的哪些部分会有所帮助,而不会给出一个巨大的块。这是我在 Javascript Subreddit 中提出的相同问题。http://www.reddit.com/r/javascript/comments/yhp7j/best_way_to_find_all_the_usernames_on_a_reddit/

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

目前正在使用这个: http: //net.tutsplus.com/tutorials/javascript-ajax/create-bookmarklets-the-right-way/

所以我有一个 Hello World Style Bookmarklet 工作,它检查 Jquery 并在它不存在时加载它,并且只是抛出一个警报。

4

1 回答 1

1

快速查看您在问题中链接到的页面,似乎围绕用户名的标记如下(可能使用您的用户名作为示例):

<a href="http://www.reddit.com/user/DiscontentDisciple" class="author id-t2_4allq" >DiscontentDisciple</a>

如果是这种情况,并且 jQuery 库可用(同样,从您的问题来看),一种方法是简单地使用:

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);

JS Fiddle 概念验证

或者,类似地,只需使用用户名似乎是可以预见的a元素href属性中 URL 的最后一部分的事实:

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);

JS Fiddle 概念验证

这两种方法都将 in 放入元素img a。如果你想要它元素之前,a那么只需使用:

// 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);
​

JS Fiddle 概念验证

参考:

于 2012-08-19T23:08:23.747 回答