با عرض سلام خدمت کاربران محترم سایت پی وی لرن.
در این جلسه قصد داریم تا یک خبر خوان (RSS Reader) را با استفاده از Ajax بسازیم.
در ادامه خواهیم دید که ساخت خبر خوان با ajax ساده می باشد.
یک خبر خوان یا RSS Reader برای خواندن خوراک RSS استفاده می شود.
در ادامه برنامه ای می نویسیم (Rss Reader با Ajax) که خبر ها را از سایت های مختلف جمع آوری می کند و به کاربر نشان می دهد.
هنگامی که کاربر گزینه ای را از لیست انتخاب میکند، تابع ()showRSS اجرا می شود.
تابع توسط رویداد onchange اجرا می شود:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 | <html> <head> <script> function showRSS(str) { if (str.length==0) { document.getElementById("rssOutput").innerHTML=""; return; } if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else { // code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (this.readyState==4 && this.status==200) { document.getElementById("rssOutput").innerHTML=this.responseText; } } xmlhttp.open("GET","getrss.php?q="+str,true); xmlhttp.send(); } </script> </head> <body> <form> <select onchange="showRSS(this.value)"> <option value="">Select an RSS-feed:</option> <option value="Google">Google News</option> <option value="NBC">NBC News</option> </select> </form> <br> <div id="rssOutput">RSS-feed will be listed here...</div> </body> </html> |
تابع ()showRSS کارهای زیر را انجام می دهد:
فایلی که توسط جاوااسکریپت در کد بالا فراخوانده شده، getrss.php نام دارد:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 | <?php //get the q parameter from URL $q=$_GET["q"]; //find out which feed was selected if($q=="Google") { $xml=("http://news.google.com/news?ned=us&topic=h&output=rss"); } elseif($q=="NBC") { $xml=("http://rss.msnbc.msn.com/id/3032091/device/rss/rss.xml"); } $xmlDoc = new DOMDocument(); $xmlDoc->load($xml); //get elements from "<channel>" $channel=$xmlDoc->getElementsByTagName('channel')->item(0); $channel_title = $channel->getElementsByTagName('title') ->item(0)->childNodes->item(0)->nodeValue; $channel_link = $channel->getElementsByTagName('link') ->item(0)->childNodes->item(0)->nodeValue; $channel_desc = $channel->getElementsByTagName('description') ->item(0)->childNodes->item(0)->nodeValue; //output elements from "<channel>" echo("<p><a href='" . $channel_link . "'>" . $channel_title . "</a>"); echo("<br>"); echo($channel_desc . "</p>"); //get and output "<item>" elements $x=$xmlDoc->getElementsByTagName('item'); for ($i=0; $i<=2; $i++) { $item_title=$x->item($i)->getElementsByTagName('title') ->item(0)->childNodes->item(0)->nodeValue; $item_link=$x->item($i)->getElementsByTagName('link') ->item(0)->childNodes->item(0)->nodeValue; $item_desc=$x->item($i)->getElementsByTagName('description') ->item(0)->childNodes->item(0)->nodeValue; echo ("<p><a href='" . $item_link . "'>" . $item_title . "</a>"); echo ("<br>"); echo ($item_desc . "</p>"); } ?> |
وقتی که یک درخواست از طرف جاوااسکریپت برای یک RSS feed فرستاده می شود، کار های زیر انجام می شوند:
جلسه ساخت خبر خوان با Ajax نیست به پایان رسید.
در جلسه بعد یک سیستم نظرسنجی را با استفاده از Ajax خواهیم ساخت. با ما همراه باشید.
همجنین می توانید نظرات و سوالات خود را از طریق بخش نظرات سایت با ما در میان بگذارید.