ansaurus

Question

Answer 1

+1 A:

Two ways:

1) If there is a JSON service, you may use JSONP (check on google, but I personally dont like this)

2) If your server side use PHP, take a look at PHPQuery, do the scraping server-side in a script, and call that script in AJAX to get the extracted data (you may want to implement some level of caching, since you are using a gateway... APC would be a friendly tool there).

Marc Trudel 2010-01-31 08:56:45

Answer 2

+2 A:

In addition to Marc's answer, you could use Yahoo's YQL service to retrieve the table with the following query

select * from html where url="http://www.ventrilo.com/status.php?hostname=144.140.154.11&amp;port=25000" and xpath='//center[4]/table'

You can then use the YQL result with jQuery to display the table on your website shown in the following demo.

Working Demo

http://jsbin.com/eveka (editable via http://jsbin.com/eveka/edit)

Full Source

JavaScript

var
  ventriloStatus = $('#ventriloStatus'),
  hostname = '144.140.154.11',
  port = 25000,
  ventriloURL = 'http://www.ventrilo.com/status.php?hostname=' + hostname + '&port=' + port,
  yqlURL = 'http://query.yahooapis.com/v1/public/yql?callback=?',
  xpath = '//center[4]/table',
  query = 'select * from html where url="' + ventriloURL + '" and xpath="' + xpath + '"'
  data = {
    q: query,
    format: 'xml',
    diagnostics: false
  };

ventriloStatus.text('Loading...');
$.getJSON(yqlURL, data, function (response) {
  ventriloStatus.html(response.results[0]).find('img').each(function () {
    this.src = 'http://www.ventrilo.com/' + this.src.split('/').slice(-1)[0];
  });
});

HTML

<!DOCTYPE html>
<html>
<head>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"&gt;&lt;/script&gt;
<meta charset=utf-8 />
<title>Ventrilo with YQL</title>
<style>
  body { font: 8pt sans-serif; }
  p { display: inline; }
  #ventriloStatus{ width: 600px; }
</style>
</head>
<body>
  <h1>Ventrilo Status</h1>
  <div id="ventriloStatus"></div>
</body>
</html>

brianpeiris 2010-01-31 10:26:51

ansaurus

tags:

views:

answers:

Retrieve external page data with jquery

Working Demo

Full Source

JavaScript

HTML

related questions