AJAX做简单的RSS聚合页面

最新推荐文章于 2026-01-06 18:22:49 发布

转载最新推荐文章于 2026-01-06 18:22:49 发布 · 493 阅读

文章标签：

#ajax #rss #xmlhttprequest #function #url #menu

与RSS有关的资料专栏收录该内容

74 篇文章

订阅专栏

本文介绍了一个简单的网页脚本，该脚本通过Ajax技术从指定URL获取RSS订阅源并将其内容动态加载到网页上。具体实现了创建XMLHttpRequest对象、发送GET请求、处理响应状态变化等功能，并将RSS中的条目显示为列表形式。

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>IamV-RSS订阅</title>
    <script type="text/javascript">
        var xmlHttp;
        function createXMLHttpRequest()
        {
            if(window.ActiveXObject)
            {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            else if(window.XMLHttpRequest)
            {
                xmlHttp = new XMLHttpRequest();
            }
        }
        function startRequest(url)
        {
            createXMLHttpRequest();
            xmlHttp.onreadystatechange = handleStateChange;
            xmlHttp.open("GET",url,true);
            xmlHttp.send(null);

        }
        function handleStateChange()
        {
            if(xmlHttp.readyState==4)
    {
     if(xmlHttp.status==200)
     {
      var doc=xmlHttp.responseXML.documentElement;
      document.getElementById('ppiicc').removeNode(true);
      for(i=1;i<doc.getElementsByTagName("item").length+1;i++)
      {
         var blogName=doc.getElementsByTagName("title")[0].firstChild.data;
         var entryName=doc.getElementsByTagName("title")[i].firstChild.data;
         var entryLink=doc.getElementsByTagName("link")[i].firstChild.data;
         document.getElementById('IamV').innerHTML += '<li><a

href="'+entryLink+'" title="'+blogName+'" target="_blank">'+entryName+'</a></li>';
      }
     }
    }

        }
    </script>
</head>

<body onLoad="startRequest('http://www.cnblogs.com/iamv/category/115593.html/rss');">
<div>
<div id="menu" style="width:300px; border-left-color: white; border-bottom-color: white;

border-top-style:ridge;border-top-color: white; border-right-style: ridge; border-left-style: ridge;

border-right-color: white;border-bottom-style: ridge;">
IamV<br />
<ul id="IamV">Blog</ul>
<img id="ppiicc" src="loading1.gif" />
</div>
</div>
</body>
</html>