Как загрузить таблицу из другой веб-страницы в массив?

Я создаю сценарий Greasemonkey/Tampermonkey, который помещает некоторую статистику в массив.

Используя JavaScript, как бы я сделал так, чтобы страница загружала URL ( http://football.fantasysports.yahoo.com/f1/326198/pointsagainst?pos=QB&ntid=) в фоновом режиме и создавала массив с двумя первыми столбцами (Rank а также Team)?

Проблема, с которой я сталкиваюсь, заключается в том, чтобы делать все это в фоновом режиме, и я полагаю, что буду использовать AJAX. Любая помощь будет оценена.

2 ответа

Решение

Для статической страницы (например, той, на которую вы ссылались) используйте GM_xmlhttpRequest() а также DOMParser чтобы извлечь элементы, которые вы хотите. Увидеть ниже.

Для динамической страницы(управляемой AJAX) используйте приемы из Как получить запрос get AJAX, чтобы дождаться отображения страницы перед возвратом ответа?


Вот полный скрипт, показывающий, как извлечь информацию со сторонней страницы и превратить ее в переменную массива:

// ==UserScript==
// @name        _Grab stuff of a *static*, third-party web site.
// @include     https://stackru.com/questions/*
// @require     http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @grant       GM_xmlhttpRequest
// ==/UserScript==

GM_xmlhttpRequest ( {
    method:     "GET",
    url:        "http://football.fantasysports.yahoo.com/f1/326198/pointsagainst?pos=QB&ntid=",
    onload:     parseResponse,
    onerror:    function (e) { console.error ('**** error ', e); },
    onabort:    function (e) { console.error ('**** abort ', e); },
    ontimeout:  function (e) { console.error ('**** timeout ', e); }
} );

function parseResponse (response) {
    var parser  = new DOMParser ();
    /* IMPORTANT!
        1) For older browsers, see
        https://developer.mozilla.org/en-US/docs/Web/API/DOMParser
        for a work-around.

        2) jQuery.parseHTML() and similar is bad because it causes images, etc., to be loaded.
    */
    var ajaxDoc         = parser.parseFromString (response.responseText, "text/html");
    var statRows        = ajaxDoc.querySelectorAll ("#statTable0 > tbody > tr");
    var newStatTable    = $(statRows).map ( function () {
        var tblRow      = $(this);
        var teamRank    = parseInt (tblRow.find (".rank-indicator").text().trim(), 10);
        var teamName    = tblRow.find ("td:eq(1)").text().trim();

        return [ [teamRank, teamName] ];
    } ).get ();

    /*-- newStatTable, is a 2-D array like:
        [   [1, "Team A"],
            [2, "Team B"],
            [3, "Team C"],
            //etc...
        ]
    */
    console.log (newStatTable);
    //alert (newStatTable);
}

Я думаю, что вы хотите сделать что-то вроде:

// ==UserScript==

// @name          Fantasy Stuff

// @namespace     http://football.fantasysports.yahoo.com/f1/326198/pointsagainst?pos=QB&ntid=

// @description   An example of Fantasy Stuff

// @include       *

// ==/UserScript==

var doc = document;
function T(t){
  return doc.getElementsByTagName(t);
}
var tms = T('tbody')[0].getElementsByTagName('a'), teams = [];
for(var i=0,n=1,l=tms.length; i<l; i++,n++){
  teams[n] = tms[i].text;
}
// teams array should hold results
console.log(teams); // in FireFox
Другие вопросы по тегам