JS operation XML Source, as the dynamic news of the page
Reference JS source code as follows (save as Rss.js file):
Copy Code code as follows:
var main = document.getElementById ("content"). getElementsByTagName ("DIV");
/*
* There is a subfolder named XML under the current directory, and the source referenced below is saved in the directory.
* The following colon is preceded by the file name, followed by the XML source address (you can download the XML file from the source, and save it as the corresponding file name after downloading)
* You can right-click on the address below, select the target save as, download after the TXT file, change the extension to XML can
* Movie: "Http://news.baidu.com/n?cmd=1&class=film&tn=rss"
* Woman: "Http://news.baidu.com/n?cmd=1&class=healthnews&tn=rss"
* House: "Http://news.baidu.com/n?cmd=1&class=housenews&tn=rss"
* Car: "Http://news.baidu.com/n?cmd=1&class=autonews&tn=rss"
* Sport: "Http://news.baidu.com/n?cmd=1&class=sportnews&tn=rss"
* edu: "Http://news.baidu.com/n?cmd=1&class=edunews&tn=rss"
*/
var Rsssource = {
Movie: "Xml/movie.xml",
Woman: "Xml/woman.xml",
House: "Xml/house.xml",
Car: "Xml/car.xml",
Sport: "Xml/sport.xml",
Edu: "Xml/edu.xml"
}
function Init () {
Loadxml (Rsssource.movie, main[0]);
Loadxml (Rsssource.woman, main[1]);
Loadxml (Rsssource.house, main[2]);
Loadxml (Rsssource.car, main[3]);
Loadxml (Rsssource.sport, main[4]);
Loadxml (rsssource.edu, main[5]);
}
function Loadxml (URL, target) {
var xml = null;
var Isie = true;
if (window. ActiveXObject)//if IE
{
XML = new ActiveXObject ("Microsoft.XMLDOM");
Isie = true;
else if (document.implementation.createDocument)//if FF
{
XML = Document.implementation.createDocument ("", "", null);
Isie = false;
}
Xml.async = false;
Xml.load (URL);
Get XML Document root node
var root = xml.documentelement;
Gets the item node in the RSS XML source
var items = root.getelementsbytagname ("item");
Create a DOM object--rss caption
var head = document.createelement ("DT");
Head.setattribute ("Style", "Background-color: #ccc; cursor:pointer;");
if (Isie) {//ie action
head.innerhtml = "<b>" + (Root.getelementsbytagname ("title") [0].text). SUBSTRING (2, 6) + "</b> <sub>" + Root.getelementsbytagname ("pubdate") [0].text + "</sub>";
Target.appendchild (head);
Create a--rss list of Dom objects
var ul = document.createelement ("ul");
Add the list to the DIV container
Target.appendchild (UL);
Loop output Daily News to Li, where items.length is the number of news bars
for (i = 0; i < items.length; i++) {
Create Dom object Li, Store news
var li = document.createelement ("Li");
Create a Dom Hyperlink Object
var lk = document.createelement ("a");
Time
The title property of the hyperlink, which is used to save the news text
Lk.title = Items[i].selectsinglenode ("title"). Text;
Set the href attribute of a hyperlink
Lk.href = Items[i].selectsinglenode ("link"). Text;
The text displayed by the hyperlink, if longer than 15 characters, is intercepted and then added ...
lk.innerhtml = lk.title.length > 18? Lk.title.substring (0) + "...": lk.title;
Lk.innertext = Lk.title;
Add Li to UL
Ul.appendchild (LI);
Add a hyperlink to Li
Li.appendchild (LK);
}
else {//non IE operation
head.innerhtml = "<b>" + (Root.getelementsbytagname ("title") [0].textcontent). SUBSTRING (2, 6) + "</b> < Sub> "+ root.getelementsbytagname (" pubdate ") [0].textcontent +" </sub> ";
Target.appendchild (head);
Create a--rss list of Dom objects
var ul = document.createelement ("ul");
Add the list to the DIV container
Target.appendchild (UL);
Loop output Daily News to Li, where items.length is the number of news bars
for (i = 0; i < items.length; i++) {
Create Dom object Li, Store news
var li = document.createelement ("Li");
Create a Dom Hyperlink Object
var lk = document.createelement ("a");
Time
The title property of the hyperlink, which is used to save the news text
Lk.title = Items[i].getelementsbytagname ("title") [0].textcontent;
Set the href attribute of a hyperlink
Lk.href = Items[i].getelementsbytagname ("link") [0].textcontent;
The text displayed by the hyperlink, if longer than 15 characters, is intercepted and then added ...
lk.innerhtml = lk.title.length > 18? Lk.title.substring (0) + "...": lk.title;
Lk.innertext = Lk.title;
Add Li to UL
Ul.appendchild (LI);
Add a hyperlink to Li
Li.appendchild (LK);
}
}
}
Show page reference source (Save as HTM page)
Copy code code as follows:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<link type=" text/css "rel=" style Sheet "href=" index.css ">
<base target=" _blank ">
<body onload=" Init () ">
<div id= "Pagebody" >
<div id= "header" >
<div id= "banner" ></div>
</div> Br><div id= "Content" >
<div class= "left" ></div>
<div class= ' right ' ></div>
& Lt;div class= ' left ' ></div>
<div class= ' right ' ></div>
<div class= ' left ' ></div& Gt
<div class= "right" ></div>
</div>
</div>
</body>
<script type= "Text/javascript" src= "rss.js" ></script>
CSS source (Save as INDEX.CSS)
Copy Code code as follows:
a:link,a:visited,a:active {
Text-decoration:none;
}
A:hover {
Text-decoration:underline;
}
#pagebody {
margin:0 auto;
width:800px;
height:1200px;
border-left:dotted 1px Gray;
border-right:dotted 1px Gray;
Background-color: #eee;
}
#header {
height:200px;
}
#banner {
height:160px;
Background-color: #fff;
}
#content div {
width:380px;
height:270px;
Border:solid 1px Gray;
Overflow:hidden;
Background-color: #fff;
}
#content Div ul li {
list-style-image:url (list.gif);
}
. Left {
Float:left;
margin-top:10px;
margin-left:10px;
}
. Right {
Float:right;
margin-top:10px;
margin-right:10px;
}
