0
点赞
收藏
分享

微信扫一扫

蛙蛙推荐:迎接web2.0:写一个RSS.HTC组件

千行 2022-01-25 阅读 80

 现在web2.0已经渐渐流行起来了,很多人都在自己的网站上直接用RSS聚合其它站点的内容来显示给浏览者,我开发了一个htc控件来方便大家实现这个功能。

Web2.0是以Flickr、43Things.com等网站为代表,以Blog、TAG、SNS、RSS、wiki等社会软件的应用为核心,依据六度分隔、xml、ajax等新理论和技术实现的互联网新一代模式。


大家先来看一段代码,想象一下它会产生什么样的效果呢?

<HTML xmlns:wawa>

<HEAD>

<?IMPORT namespace="wawa" implementation="rss.htc">

</HEAD>

<BODY>

   <wawa:rss feedURL="http://www.microsoft.com/china/msdn/rss.xml" top="5" leftstr="25">

   <TABLE width="500" style="font-size:12px; ">

   <!--loop-->

   <TR>

       <TD rowspan="2" valign="top">★</TD>

       <TD><a href="{#link}" title="{#description}">{#title}</a>

    </TD>

   </TR>

   <TR>

     <TD><b>描述:</b>{#description}</TD>

   </TR>

   <!--/loop-->

   </TABLE>

   </wawa:rss>

</BODY>

</HTML>




它的显示如下图

不可思议吧,其实我是写了一个htc组件,我来介绍一下我开发的这个html组件的属性和替换标签哦,feedURL属性表示你要引用的rss的地址,我这里使用的是中文MSDN的rss地址,top属性表示最多显示几条记录,leftstr属性表示消息标题(title)的最大长度,超过这个长度就用省略号表示。然后呢,开标签和闭标签之间的内容是模板,你可以定义循环节,它包含在<!--loop-->和<!--/loop-->之间,这里面的内容是重复显示的,其中{#link}被替换成链接的地址,{#description}替换成描述,{#title}替换成消息标题,其它的就没了,因为RSS1和RSS2有很大的不同,所以为了实现最大兼容就实现了这几个标签。也没写什么SDK,就简单谢谢帮助就行了,相信大家都会用。


其实源码也很简单的,我贴一下。



<PUBLIC:COMPONENT tagName="rss">

<PUBLIC:DEFAULTS 

   canHaveHTML=true

   viewLinkContent=true

/>   

<PUBLIC:ATTACH event="ondocumentready" onEvent="onDocumentReady()" />

</PUBLIC:COMPONENT>

<SCRIPT language="JScript">

var m_oHttp;

var m_SourceStr;

function onDocumentReady()

{

    m_SourceStr = this.innerHTML;

    m_SourceStr = m_SourceStr.replace(/<tbody>|<\/tbody>/ig,"");

    m_oHttp = new ActiveXObject("Microsoft.xmlhttp");

    m_oHttp.open("GET", this.element.feedURL, true); 

    m_oHttp.onreadystatechange = onHttpReady;

    m_oHttp.send();

}

function onHttpReady()

{

    var outStr = "";

    var loopStr = "";

    if ((m_oHttp.readyState != 4) || (m_oHttp.status != 200) || 

(m_oHttp.responseXML == null))

        return;

    outStr += m_SourceStr.substring(0,m_SourceStr.indexOf("<!--loop-->"));

    loopStr += m_SourceStr.substring(m_SourceStr.indexOf("<!--loop-->")+11,m_SourceStr.indexOf("<!--/loop-->"));

    var oNodes = m_oHttp.responseXML.selectNodes("rss/channel/item");

    if ((oNodes == null) || (oNodes.length == null))

        return;

    for (var i = 0; i < oNodes.length && i < this.element.top; i++)

    {

        var tempStr = loopStr.replace(/{#link}/ig,oNodes[i].selectSingleNode("link").text);

        if(oNodes[i].selectSingleNode("title").text.length > this.element.leftstr)

        {

            tempStr = tempStr.replace(/{#title}/ig,oNodes[i].selectSingleNode("title").text.substring(0,this.element.leftstr) + "");

        }

        else

        {

            tempStr = tempStr.replace(/{#title}/ig,oNodes[i].selectSingleNode("title").text);    

        }

        tempStr = tempStr.replace(/{#description}/ig,oNodes[i].selectSingleNode("description").text);

        outStr += tempStr;

    }

    outStr += m_SourceStr.substring(m_SourceStr.indexOf("<!--/loop-->")+12);

    divRSS.innerHTML += outStr;

}

</SCRIPT>

<div id="divRSS"></div>





举报

相关推荐

0 条评论