YOMEDIA
Xây dựng Ajax RSS Reader - Step by Step
Chia sẻ: Abcdef_44 Abcdef_44
| Ngày:
| Loại File: PDF
| Số trang:8
42
lượt xem
9
download
Download
Vui lòng tải xuống để xem tài liệu đầy đủ
Chuẩn bị XMLHttpRequest Object Trong bước đầu tiên chúng ta cần chuẩn bị XMLHttpRequest object sử dụng để load remote RSS. Tôi đã kiểm tra và phát hiện ra đoạn mã này chỉ hoạt động với Firefox, vì thế tôi đã thêm ActiveXObject phục vụ cho IE. var RSSRequestObject = false; // XMLHttpRequest Object
AMBIENT/
Chủ đề:
Nội dung Text: Xây dựng Ajax RSS Reader - Step by Step
- Xây dựng Ajax RSS Reader - Step by Step
Chuẩn bị XMLHttpRequest Object
Trong bước đầu tiên chúng ta cần chuẩn bị XMLHttpRequest object sử dụng
để load remote RSS. Tôi đã kiểm tra và phát hiện ra đoạn mã này chỉ hoạt động
với Firefox, vì thế tôi đã thêm ActiveXObject phục vụ cho IE.
var RSSRequestObject = false; // XMLHttpRequest Object
if (window.XMLHttpRequest) // try to create XMLHttpRequest
RSSRequestObject = new XMLHttpRequest();
if (window.ActiveXObject) // if ActiveXObject use the Microsoft.XMLHTT P
RSSRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
Viết mã HTML
Chỉ cần một vài dòng, 2 thẻ DIV được dùng để tạo status thông báo về tiến
trình request data, và ajaxreader để chứa kết quả. Trong onload chúng ta để
AJAX Reader.
-
AJAX RSS Reader
AJAX RSS Reader
AJAX Reader sẽ gửi một request tới URL được đặt sẵn, sau đó chạy function
ReqChange() khi dữ liệu đã được load. Tôi đã thêm vào m ột vài hàm phụ phục
vụ cho việc ẩn/hiện kết quả...
var Backend = 'http://ajax.phpmagazine.net/index.xml'; // Backend url
/*
* Main AJAX RSS reader request
*/
- function RSSRequest() {
// change the status to requesting data
HideShow('status');
document.getElementById("status").innerHTML = "Requesting d ata ...";
// Prepare the request
RSSRequestObject.open("GET", Backend , true);
// Set the onreadystatechange function
RSSRequestObject.onreadystatechange = ReqChange;
// Send
RSSRequestObject.send(null);
}
function HideShow(id){
var el = GetObject(id);
if(el.style.display=="none")
el.style.display='';
else
el.style.display='none';
- }
function GetObject(id){
var el = document.getElementById(id);
return(el);
}
Trình bày kết quả
Cuối cùng chúng ta chỉ cần hiện ra kết quả đã load vè. Nếu như data đã được
load hoàn chỉnh, chúng ta cần phân tích RSS data để xác định các thông tin
như title, url, description ...
/*
* onreadystatechange function
*/
function ReqChange() {
// If data received correctly
if (RSSRequestObject.readyState==4) {
// if data is valid
- if (RSSRequestObject.responseText.indexOf('invalid') == -1)
{
// Parsing RSS
var node = RSSRequestObject.responseXML.documentElement;
// Get Channel information
var channel = node.getElementsByTagName('channel ').item(0);
var title = channel.getElementsByTagName('title').item(0).firstChild.data;
var link = channel.getElementsByTagName('link').item(0).firstChild.data;
content = ''+title+'';
// Browse items
var items = channel.getElementsByTagName('item');
for (var n=0; n ['+items[n].getElementsByTagName('pubDate').item(0).firstChild.data+']
';
}
- catch (e)
{
var itemPubDate = '';
}
content += ''+itemPubDate+''+itemTitle+'';
}
content += '';
// Display the result
document.getElementById("ajaxreader").innerHTML = content;
// Tell the reader the everything is done
document.getElementById("status").innerHTML = "Done.";
}
else {
- // Tell the reader that there was error requesting data
document.getElementById("status").innerHTML = "Error
requesting data.";
}
HideShow('status');
}
}
Cập nhật Feed
Tôi đặt khoảng thời gian chờ để cập nhật feed là 20 phút.
window.setInterval("update_timer()", 1200000); // update the data every 20
mins
/*
* Timer
*/
function update_timer() {
- RSSRequest();
}
Thêm tài liệu vào bộ sưu tập có sẵn:
Báo xấu
LAVA
ERROR:connection to 10.20.1.98:9315 failed (errno=111, msg=Connection refused)
ERROR:connection to 10.20.1.98:9315 failed (errno=111, msg=Connection refused)
Đang xử lý...
Thêm vào BST
Báo xấu
