思路還是很清晰的，雖然只是實現了樣本功能，但是其它的也都是大同小異。
?
有這么幾個地方值得以后借鑒：
?
1。特殊的for循環：
1?for?(var?a=1;a<td_item.childNodes.length;)?????
2?{
3???delete_item_exits=td_item.childNodes[a];
4???td_item.removeChild(delete_item_exits);
5?}
?? 在這個循環里面，由于執行的是刪除td_item的字節點，所以td_item.childNodes.length的長度是遞減的。這個時候如果要讓循環正常執行，a值應固定不變；
?
2。動態生成按鈕并動態設置其onclick事件：
1?ch_input=document.createElement("input");
2??????ch_input.type="button";
3??????ch_input.value="查看主題"
4??????ch_input.onclick=function(){ShowRssItem(callM);};??//注意這一句
5??????ch_input.className="button";
6??????ch_input.id="ch_input_"+callM;
?
其中ShowRssItem(callM)函數如下：
function
?ShowRssItem(callShowNo)
{
?div_item[showNo].className
=
"
div_item?hidden
"
;
?div_channel[showNo].className
=
"
div_channel
"
;
?showNo
=
callShowNo;
?div_item[showNo].className
=
"
div_item
"
;
?div_channel[showNo].className
=
"
div_channel_selected
"
;
}
?
經過我的實驗，ch_input.onclick事件需要上面這么添加才能夠實現其功能，這里列舉一下沒有成功的方法：
1。
ch_input.onclick="ShowRssItem("+callM+")";
??? 這種方法生成的onclick在dom里查看是正常的，如下所示：
??? <INPUT class=button onclick=ShowRssItem(0) type=button value=提交 id=ch_input_0>
??? 但就是不能執行其功能。甚至：手動修改生成后的dom中的onclick事件，然后再還原成修改前的樣子（就相當于沒有修改），竟然可以了！百思不得其解，不能給出一個好的解釋。但是可以確定的是，這個方法不能實現。
?
2。
ch_input.onclick=new?function(){
}; ????這種方法失敗的原因是，頁面在初始化的時候就會執行這個function，而不是在onclick事件。
?
?
目前還有一個問題亟待解決就是如何控制html實體轉義。我通過遍歷xml文檔查找節點找到的無論是.text還是.xml還是.nodeValue里面的內容都被轉義了。這樣我就沒有辦法用innerHTML。等我在詳細了解了解其中的原理。盼望高手解答。
?
以上謹代表個人觀點。總的來說，這次做的還是比較愉快的，是我第一個較為完整的javascript。希望大家批評指正！
?
附源代碼：（測試：ie6+
RSS2.0)
下載代碼html文件：
?1?<html>
?2?????<head>
?3?????<title>poppy's?RSS2.0頁面訂閱器(test?for?IE6+)</title>
?4?????????<script?src="getrss.js">function?table_show_onclick()?{
?5?????
?6?}
?7?
?8?</script>
?9?????????<link?href="rss.css"?rel=stylesheet?type="text/css">
10?????????<style?type="text/css">
11?<!--
12?.style3?{
13?????font-family:?Geneva,?Arial,?Helvetica,?sans-serif;
14?????font-size:?24pt;
15?}
16?body?{
17?????
18?}
19?.style4?{font-family:?Geneva,?Arial,?Helvetica,?sans-serif;?font-size:?8pt;?}
20?-->
21?????????</style>
22?????<meta?http-equiv="Content-Type"?content="text/html;?charset=gb2312"/></head>
23?
24?????<body?onload="StartRequest(text.value)">
25?<table?width="770"?border="0"?align="center"?cellpadding="0"?cellspacing="0"?class="normal"?id="table_show">
26?????????<tr>
27?????????<td?colspan="2"><p?class="style3">poppy's?RSS2.0頁面訂閱器(test?for?IE6+)</p>
28???????????<p?class="style4">僅支持RSS(2.0)?|?僅支持IE6+?|?僅支持純文本?|?測試請用http://xnotes.xearch.biz/rss.xml(人大校內)/http://poppy.cnblogs.com/rss.aspx(校外)
29???????????????|
30???????????</p><hr?/></td>
31???</tr>
32???????<tr>
33?????????<td??align="left"?valign="top"?style="width:?200px;"><div?id="div_notice"?class="none"><p>沒有訂閱任何rss</p></div></td>
34?????????<td??align="right"?style=""?valign="middle"><div?class="div_submit">訂閱RSS(2.0)種子：http://
35???????????????<input?name="text"?type="text"?value="www.marketingman.net/rss.xml"/><input?type="Submit"?name="Submit"?value="提交"?onclick="StartRequest(text.value)"?class="button"/>
36?????????</div><p?/></td>
37???????</tr>
38???????????<tr>
39?????????????<td?valign="top"?ID="td_channel"?style="height:?28px;?width:?200px;">
40???????????????<div>頻道列表：</div>
41?????????????</td>
42?????????????<td?width="570"?align="left"?valign="top"?bgcolor="#FFFFCC"?id="td_item"?style="height:?28px"><div?style="background-color:#FFFFFF;width:100%">主題列表：</div></td>
43???????????</tr>
44???????????<tr>
45?????????????<td?style="width:?200px"></td>
46?????????????<td><div?align="right">Powered?By?poppy,MSN:poppy_rr@msn.com?:)</div></td>
47?????????</tr>
48?????</table>
49?????</body>
50?</html>
js文件：
??1?
var?showNo=0;???????????????????//用于記錄當前選定的channel序號
??2?
var?div_item=new?Array();??????????//不同頻道的items顯示用的div數組，需要跨方法(BindRssItem()、ShowRssItem())調用，并且ShowRssItem需要直接從網頁調用（含參數），所以定義為全局變量
??3?
var?div_channel=new?Array();????//同上
??4?
var?xmlHttp;
??5?
??6?
function?CreateXMLHttpRequest()
??7?
{
??8?
????if?(window.ActiveXObject)
??9?
????{
?10?
????????//alert("ie");
?11?
????????xmlHttp=new?ActiveXObject("Msxml2.XMLHTTP.3.0");
?12?
????}
?13?
????else?if?(window.XMLHttpRequest)
?14?
????{
?15?
????????//alert("firefox");
?16?
????????xmlHttp=new?XMLHttpRequest();
?17?
????}
?18?
}
?19?
?20?
function?Notice(callReadyState,callStatus)
?21?
{
?22?
????var?div_notice=document.getElementById("div_notice");
?23?
????//alert(div_notice.getElementsByTagName("p").item(0).childNodes[0].nodeValue);
?24?
????if?(callReadyState==4?&&?callStatus==200)
?25?
????{
?26?
????????div_notice.getElementsByTagName("p").item(0).childNodes[0].nodeValue="加載成功！:-)";??
?27?
????????div_notice.className="loaded";??
?28?
????????div_notice.align="center";
?29?
????}
?30?
????else?if?(callReadyState!=4)
?31?
????{
?32?
????????div_notice.getElementsByTagName("p").item(0).childNodes[0].nodeValue="正在加載";
?33?
????????div_notice.className="loading";??????
?34?
????}
?35?
????else?if?(callReadyState==4?&&?callStatus!=200)
?36?
????{
?37?
????????div_notice.getElementsByTagName("p").item(0).childNodes[0].nodeValue="加載失敗！:-(";
?38?
????????div_notice.className="none";??
?39?
????}
?40?
}
?41?
?42?
function?handleStateChange()
?43?
{?
?44?
????//alert("readyState:"+xmlHttp.readyState);
?45?
????if?(xmlHttp.readyState==4)
?46?
????{???
?47?
????????//alert("status:"+xmlHttp.status);
?48?
????????//alert(xmlHttp.responseXML.xml);
?49?
????????//alert(xmlHttp.status);
?50?
????????Notice(xmlHttp.readyState,xmlHttp.status);
?51?
????????if(xmlHttp.status==200||xmlHttp.status==0)
?52?
????????{
?53?
????????????DeleteLastPage();
?54?
????????????
?55?
????????????//創建xml標簽并加載來自(callUrl)的rss種子(callUrl)
?56?
????????????var?xml_rss=xmlHttp.responseXML;
?57?
????????????????//alert(xml_rss.xml);
?58?
????????????var?channel=xml_rss.selectNodes("rss/channel");
?59?
???????????????//?alert(channel[0].text);
?60?
????????????BindRss(channel,0);?????????????//調用BindRss方法
?61?
????????}
?62?
????}
?63?
????else
?64?
????{
?65?
????????Notice(xmlHttp.readyState,0);
?66?
????}
?67?
????
?68?
}
?69?
?70?
function?DeleteLastPage()
?71?
{
?72?
????var?td_item=document.getElementById("td_item");?????????????//網頁中用于存放item的單元格
?73?
????var?td_channel=document.getElementById("td_channel");???????//網頁中用于存放channel的單元格
?74?
????//當PostBack的時候對當前頁面dom進行初始化(刪除上一操作生成的所有節點)
?75?
????if?(td_channel.childNodes.length>1)
?76?
????{????
?77?
????????//alert?(document.getElementsByTagName("xml").length);
?78?
????????
?79?
????????//var?div_channel_exits=document.getElementsByTagName("DIV");
?80?
????????//alert?(div_channel_exits[2].childNodes[1].nodeName);
?81?
????????//alert?(td_item.childNodes.length);
?82?
????????var?delete_item_exits;
?83?
????????????for?(var?a=1;a<td_item.childNodes.length;)??????
?84?
????????????{
?85?
????????????????delete_item_exits=td_item.childNodes[a];
?86?
????????????????//alert?("item?node:"+delete_item_exits.nodeName+","+td_item.childNodes.length);
?87?
????????????????td_item.removeChild(delete_item_exits);
?88?
????????????}
?89?
????????var?delete_channel_exits;
?90?
????????????for?(var?a=1;a<td_channel.childNodes.length;)
?91?
????????????{
?92?
????????????????delete_channel_exits=td_channel.childNodes[a];
?93?
????????????????//alert?("channel?node:"+delete_item_exits.nodeName+","+td_channel.childNodes.length);
?94?
????????????????td_channel.removeChild(delete_channel_exits);
?95?
????????????}
?96?
????????showNo=0;
?97?
????}
?98?
}
?99?
100?
function?StartRequest(callUrl)
101?
{
102?
????CreateXMLHttpRequest();
103?
????xmlHttp.onreadystatechange=handleStateChange;
104?
????xmlHttp.open("GET","http://"+callUrl,true);
105?
????xmlHttp.send();
106?
}
107?
108?
//BindRss方法：調用BindRssChannel、BindRssItem方法加載channel和item信息，最后ShowRssItem方法設定當前選定的channel下的items
109?
function?BindRss(channel,callShowNo)
110?
{
111?
????for(var?m=0;m<channel.length;m++)
112?
????{
113?
????????div_channel[m]=document.createElement("div");
114?
????????????div_channel[m].className="div_channel";
115?
????????????td_channel.appendChild(div_channel[m]);
116?
????????BindRssChannel(div_channel[m],channel,m);
117?
????
118?
????????div_item[m]=document.createElement("div");
119?
????????????div_item[m].className="div_item?hidden";
120?
????????????td_item.appendChild(div_item[m]);
121?
????????BindRssItem(div_item[m],channel,m);????
122?
????}
123?
????ShowRssItem(callShowNo);
124?
}
125?
126?
//BindRssChannel方法：提取Chanel信息并且設定顯示樣式
127?
function?BindRssChannel(callDiv,callChannel,callM)
128?
{
129?
????var?div_channel=callDiv;
130?
????channel=callChannel;
131?
????var?channel_title=channel[callM].getElementsByTagName("title");
132?
????var?channel_link=channel[callM].getElementsByTagName("link");
133?
????var?channel_description=channel[callM].getElementsByTagName("description");
134?
????//var?channel_language="";
135?
????//var?channel_image="";
136?
????//var?channel_image_title="";
137?
????//var?channel_image_url="";
138?
????//var?channel_image_link="";
139?
140?
????//alert?(channel_description.item(0).text);
141?
????var?ch_description=document.createTextNode("簡介:"+channel_description.item(0).text);
142?
????var?ch_link_text=document.createTextNode("[頻道"+(callM+1)+":]"+channel_title.item(0).text);
143?
????????var?ch_br=document.createElement("br");
144?
????????var?ch_p=document.createElement("p");
145?
????var?ch_a=document.createElement("a");
146?
????????ch_a.href=channel_link.item(0).text;
147?
????????ch_a.appendChild(ch_link_text);
148?
????????ch_a.target="blank";
149?
????ch_input=document.createElement("input");
150?
????????ch_input.type="button";
151?
????????ch_input.value="查看主題"
152?
????????ch_input.onclick=function(){ShowRssItem(callM);};??//這句非常好！！！！
153?
????????ch_input.className="button";
154?
????????ch_input.id="ch_input_"+callM;
155?
????var?ch_div=document.createElement("div");
156?
????????ch_div.className="normal";
157?
????div_channel.appendChild(ch_a);
158?
????div_channel.appendChild(ch_br);
159?
????div_channel.appendChild(ch_input);
160?
????div_channel.appendChild(ch_p);
161?
????ch_p.appendChild(ch_div);
162?
????ch_div.appendChild(ch_description);
163?
????
164?
}
165?
166?
//?ShowRssItem：顯示不同channel的items?http://www.ppitt.net/2317.HTM
167?
function?ShowRssItem(callShowNo)
168?
{
169?
????div_item[showNo].className="div_item?hidden";
170?
????div_channel[showNo].className="div_channel";
171?
????showNo=callShowNo;
172?
????div_item[showNo].className="div_item";
173?
????div_channel[showNo].className="div_channel_selected";
174?
}
175?
176?
//BindRssItem：提取指定頻道的Item并且設定顯示樣式
177?
function?BindRssItem(callDiv,callChannel,callM)
178?
{
179?
????channel_item=callChannel(callM).getElementsByTagName("item");
180?
????for?(var?n=0;n<channel_item.length;n++)
181?
????{
182?
????????channel_item_title=channel_item.item(n).getElementsByTagName("title");
183?
????????channel_item_description=channel_item.item(n).getElementsByTagName("description");
184?
????????channel_item_link=channel_item.item(n).getElementsByTagName("link");
185?
????????????
186?
????????var?p=document.createElement("p");
187?
????????var?span=document.createElement("span");
188?
????????????span.className="notice";
189?
????????var?zhaiYao=document.createTextNode("摘要:");
190?
????????var?description=document.createTextNode(channel_item_description.item(0).text);
191?
????????
192?
????????var?link_text=document.createTextNode(n+1+".標題:"+channel_item_title.item(0).text);
193?
????????var?a=document.createElement("a");
194?
????????????a.href=channel_item_link.item(0).text;
195?
????????????a.appendChild(link_text);
196?
????????????a.target="blank";
197?
????????//alert(channel_item_description.item(0).text)
198?
????????span.appendChild(zhaiYao);
199?
????????callDiv.appendChild(a);
200?
????????callDiv.appendChild(p);
201?
????????p.appendChild(span);
202?
????????p.appendChild(description);
203?
????????//p.innerText+=channel_item_description.item(0).text;
204?
????????//span.innerHTML=description;
205?
????????td_item.appendChild(callDiv);
206?
????}
207?
} css樣式表：
?1?.div_item
?2?{
?3?????border-width:1;
?4?????border-style:dashed;
?5?????border-color:#666666;
?6?????background-color:#FFFFCC;
?7?????font-size:9pt;
?8?????white-space:normal;
?9?????width:570px;
10?????
11?}
12?
13?.normal
14?{
15?????font-size:9pt;
16?}
17?
18?.div_channel
19?{
20?????border-width:1;
21?????border-style:dashed;
22?????border-color:#666666;
23?????font-size:14px;
24?????font-family:"黑體";
25?????white-space:normal;
26?????width:200px;
27?????filter:BlendTrans(duration=5);?
28?}
29?
30?.div_channel_selected
31?{
32?????border-width:1;
33?????border-style:dashed;
34?????border-color:#666666;
35?????background-color:#FFFFCC;
36?????font-size:9pt;
37?????white-space:normal;
38?????width:200px;
39?}
40?
41?.hidden
42?{
43?????display:none;
44?????filter:BlendTrans(duration=5);
45?}
46?
47?.div_submit
48?{
49?????color:#333333
50?????background-color:#FFFFFF;
51?????border-width:1px;
52?????border-style:dashed;
53?????border-color:#666666;
54?????height:100%;
55?}
56?
57?.button
58?{
59?????border-style:double;
60?????border-width:1px;
61?????background-color:#FFFFFF;
62?}
63?
64?.notice
65?{
66?????color:#993300;
67?????font-size:12pt;
68?????font-family:"??";
69?????font-weight:bold;
70?}
71?
72?.loading
73?{
74?????background-color:Red;
75?????color:White;
76?????width:80px;
77?}
78?
79?.loaded
80?{
81?????color:White;
82?????width:50%;
83?????background-color:Green;????
84?}
85?
86?.none
87?{
88?????background-color:Gray;????
89?????color:White;
90?????width:80px;
91?}
下載的文件已經更新。
190-202行改動如下：
var description=document.createTextNode(channel_item_description.item(0).childNodes[0].text);
var obj=channel_item_description.item(0).childNodes[0];
obj.text=obj.text.replace(/<!\[CDATA\[[^\]]/,"");
var hr=document.createElement("hr");
var link_text=document.createTextNode(n+1+".標題:"+channel_item_title.item(0).text);
var a=document.createElement("a");
a.href=channel_item_link.item(0).text;
a.appendChild(link_text);
a.target="blank";
span.appendChild(zhaiYao);
callDiv.appendChild(a);
callDiv.appendChild(p);
p.appendChild(span);
callDiv.innerHTML+=obj.text+"<hr/>";