最近比較閒,閒暇時間用來折騰了一個小玩意,就是把魔獸世界英雄榜的RSS調用到我的博客來顯示。我是演示君喲

好吧這個東西是很無聊,除了得瑟以外沒有任何意義,不能提高任何用戶體驗……但是對於我來說是第一次真正直面Ajax和跨域問題。我終於理解了為啥我之前各種百寫不成其功的原因了= =|||最後在林木木處搜了好幾篇文章,相互參照,才搞定了這個問題。主要解決方案來自該文[jQuery] 制作 Box.net 文件外链展示页面。嗯,木木說解決跨域問題的xml.php是荒野無燈寫的,那就一併感謝了吧!

其實英雄榜的rss地址非常糾結:
http://cn.wowarmory.com/character-feed.atom?r=角色名&cn=服務器名&locale=zh_CN

這種結構的鏈接沒法像木木的例子那樣直接通過get來獲取xml:
url:'xml.php?act=cache&lifetime=86400&url='+rss+'/rss.xml'

那麼,我只好用了一種很笨很簡單的解決辦法,就是改xml.php。(沒什麼技術含量,但是很有效!)把文件里原本通過get方式獲取的rss地址,替換成固定的rss地址。
$url = $_REQUEST['url'];
$url = 'http://cn.wowarmory.com/character-feed.atom?r=角色名&cn=服務器名&locale=zh_CN';

這樣就可以成功讀取xml了。

接著做的工作,其實就是照抄木木的jquery代碼,因為我的功能更簡單,所以進行了一些簡化。

$(document).ready(function() {
    $.ajax({ //創建ajax函數
        data:'xml', //定義數據類型
        url:'xml.php?act=cache&lifetime=86400', //解析rss的xml,因為已經把url直接寫進php了,所以這裡就簡化了
        cache:false, //禁用瀏覽器緩存,防止xml文件已更新而瀏覽器解析出的內容不更新(照抄)
        success:function(xml) { //成功后把rss對象命名為xml
            $(xml).find('entry').each(function(i,item) { //遍歷所有entry節點,每個節點定義為item
                var head = $(item).children('title').text(); //獲取事件標題
                var time = $(item).children('updated').text(); //獲取事件時間
                var html = '<div class="entry"><h2>' + head + '</h2>' + time + '</div>'; //構建html代碼
                $('#achieve').append(html); //添加到對應頁面對象
            });
        }
    });
});

有些東西看起來挺複雜的,但是實際上自己動手就會發現沒什麼大不了的,就像窗戶紙一樣一捅就破。關鍵的只有兩個:一個是想要捅破窗戶紙的勇氣,以及一個叫你沾濕了手指去捅的人。咳……不過就算這麼說- -調試js果然是非常痛苦的事情啊……