操作Yahoo Pipes和jQuery做一个RSS挂件
|
假如我们但愿把一个网站的更新究竟宣布到令一个网站上，最好的要领是通过 RSS 举办转载。假如只是必要简朴的对更新的条目做个提醒的话，行使 JavaScript 是最可行的要领。可是通过 JavaScript 理会一个 XML 文档异常贫困。幸好 Yahoo Pipes 为我们提供了很是好的 RSS to JSON 成果，我们可以先把 RSS 转换成 JSON 再用 JavaScript 举办理会，这样比直接理会 XML 简朴得多! 把 RSS 转换成 JSON 起首登录 http://pipes.yahoo.com ，新建一个 Pipe ( Creat a Pipe ) 。然后在左边的器材里选择 Sources > Fetch Feed ，在输入框里输入一个 RSS 地点。再用线把 Fetch Feed 和 Pipe Output 两个框框连起来(如上图)，生涯这个 Pipe，然后点击顶部的 Run Pipe… 。点击 Publish 宣布这个 Pipe ，然跋文下 Get as JSON 的 URL。简朴几步就已经把一个 RSS 转换成 JSON 了，并且这个 JSON 会按照 RSS 的更新自动更新。 通过 jQuery 理会 JSON jQuery 自己为我们提供了一个 getJSON() 函数，为我们理会 JSON 提供简朴快捷的要领。  引用的内容：[www.veryhuo.com]
<div id="rssdata"> <ul class="rss-items"></ul> <div class="loading">Loading RSS items...</div> </div> <p>然后编写 jQuery 挪用：</p> Copy to Clipboard 引用的内容：[www.veryhuo.com]
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> $('#rssdata').ready(function() { // JSON 地点 = 适才记下的 URL + &_callback=? var pipe_url = 'http://pipes.yahoo.com/pipes/pipe.run?_id=90caf3b6ba8f36459a3137248b47620e&_render=json&_callback=?'; $.getJSON(pipe_url,function(data) { // 遍历 JSON 项目，而且确定输出哪些信息 $(data.value.items).each(function(index,item) { var item_html = '<li><a href="'+item.link+'">'+item.title+'</a></li>'; // 把输出的内容插入页面里 $('#rssdata ul.rss-items').append(item_html); }); // 添加条目载入结果 $('#rssdata div.loading').fadeOut(); $('#rssdata ul.rss-items').slideDown(); }); }); </script> 虽然要页面雅观的话，写一些 CSS 是须要的，这个可以随本身的兴趣而定。最终的结果可以看这个 DEMO 原文链接：http://blog.imbolo.com/create-a-simple-ajax-rss-widget-with-jquery-and-yahoo-pipes/ （编辑：河北网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
