我想知道如何从RSS中的项目中取出img src。我使用HTML和JavaScript来读取标签。
HTML& JAVASCRIPT:
<html>
<body>
<script>
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET","news.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;
var x=xmlDoc.getElementsByTagName("item");
for (i=0;i<x.length;i++)
{
var title = x[i].getElementsByTagName("title")[0].childNodes[0].nodeValue;
var linkstr = x[i].getElementsByTagName("link")[0].childNodes[0].nodeValue;
var datestr = x[i].getElementsByTagName("pubDate")[0].childNodes[0].nodeValue;
var image = x[i].getElementsByTagName("img")[0].childNodes[0].nodeValue;
document.write(title);
document.write(linkstr);
document.write(datestr);
document.write(image);
}
</script>
</body>
</html>
XML:
<description><![CDATA[<div style="margin: 5px 5% 10px 5%;"><img src="http://website.com/news/1/images/image.jpg" width="90%" /></div>
<content:encoded><![CDATA[<div style="margin: 5px 5% 10px 5%;"><img src="http://website.com/news/1/images/image.jpg" width="90%" /></div><div><p>This is news this is news this is news this is news.</p>
</div><p><a rel="nofollow" href="http://website.com/news/1">This is news</a><a rel="nofollow" href="http://website.com">Website</a>.</p>
]]></content:encoded>
<enclosure url="http://website.com/news/1/images/image.jpg" length="174264" type="image/jpg" />
<media:content xmlns:media="http://search.yahoo.com/mrss/" url="http://website.com/news/1/images/image.jpg" width="640" height="640" medium="image" type="image/jpeg">
<media:copyright>Website</media:copyright>
</media:content>
<media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="http://website.com/news/1/images/image.jpg" width="640" height="640" />
所以起初我尝试过这样的事情:
var image = x[i].getElementsByTagName("img")[0].childNodes[0].nodeValue;
var image = x[i].getElementsByTagName("enclosure")[0].childNodes[0].nodeValue;
var image = x[i].getElementsByTagName("url")[0].childNodes[0].nodeValue;
var image = x[i].getElementsByTagName("media:content")[0].childNodes[0].nodeValue;
var image = x[i].getElementsByTagName("media:thumbnail")[0].childNodes[0].nodeValue;
但是他们都没有工作..我使用wordpress,起初我在寻找为我的RSS创建自己的标签的方法,你可以把你自己的内容选择,但我不能这样做。
必须有办法从imml文件中获取img,但我不知道如何。我试过看这里,但它对我不起作用..
get image out of CDATA and description tag with jquery
编辑:
在这里查看要求的项目元素
<item>
<title>This is news</title>
<link>http://website.com/blog/wordpress/this-is-news/</link>
<comments>http://website.com/blog/wordpress/this-is-news/#comments</comments>
<pubDate>Wed, 2 Jun 2013 05:12:12 +0000</pubDate>
<dc:creator><![CDATA[Website]]></dc:creator>
<category><![CDATA[Uncategorized]]></category>
<guid isPermaLink="false">http://www.website.com/blog/wordpress/?p=22</guid>
<description><![CDATA[<div style="margin: 5px 5% 10px 5%;"><img src="http://website.com/blog/wordpress/wp-content/uploads/2014/10/image.jpg" width="90%" /></div>
<div>This is news this is news this is news this is news this is news.</div>
<p>The post <a rel="nofollow" href="http://website.com/blog/wordpress/this-is-news/">This is news</a> appeared first on <a rel="nofollow" href="http://website.com/blog/wordpress">website.com</a>.</p>
]]></description>
<content:encoded><![CDATA[<div style="margin: 5px 5% 10px 5%;"><img src="http://website.com/blog/wordpress/wp-content/uploads/2014/10/image.jpg" width="90%" /></div><div><p>This is news this is news this is news this is news this is news.</p>
</div><p>The post <a rel="nofollow" href="http://website.com/blog/wordpress/this-is-news/">This is news</a> appeared first on <a rel="nofollow" href="http://website.com/blog/wordpress">website.com</a>.</p>
]]></content:encoded>
<wfw:commentRss>http://website.com/blog/wordpress/this-is-news/feed/</wfw:commentRss>
<slash:comments>0</slash:comments>
<enclosure url="http://website.com/blog/wordpress/wp-content/uploads/2014/10/image.jpg" length="174264" type="image/jpg" />
<media:content xmlns:media="http://search.yahoo.com/" url="http://website.com/blog/wordpress/wp-content/uploads/2014/10/image.jpg" width="640" height="640" medium="image" type="image/jpeg">
<media:copyright>website.com</media:copyright>
</media:content>
<media:thumbnail xmlns:media="http://search.yahoo.com/" url="http://website.com/blog/wordpress/wp-content/uploads/2014/10/image.jpg" width="640" height="640" />
</item>
已解决:
代替
var image = x[i].getElementsByTagName("img")[0].childNodes[0].nodeValue;
有关
var img = $(x[i]).find('enclosure').attr('url');
(你应该添加jQuery库)
答案 0 :(得分:1)
在js变量中编写xml然后你必须使用:
var myXML = ....
var split1 = myXML.split('url="');
...
..
.
或者您使用jQuery。
答案 1 :(得分:0)
尝试使用此代码,而不是您的代码:
Wordpress中的var image_URLs = [];
$.ajax({
url : "news.xml",
//async : false, //uncomment fot sync use
success : function(data){
data = $(data);
data.find("item").each(function(i){
var URL = $(this).find("enclosure").attr("url");
console.log ("img n#"+ i + ":",URL);
image_URLs.push(URL);
});
},
error : function(a,b,c){
console.log(a,b,c);
}
});
查看浏览器的控制台,以查看jQuery解析XML或脚本是否找到您的图像时是否存在错误。
<html>
<body>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
var image_URLs = [];
$.ajax({
url : "/news.xml",
//async : false, //uncomment fot sync use
success : function(data){
data = $(data);
data.find("item").each(function(i){
var URL = $(this).find("enclosure").attr("url");
console.log ("img n#"+ i + ":",URL);
image_URLs.push(URL);
});
},
error : function(a,b,c){
console.log(a,b,c);
}
});
</script>
</body>
</html>
如果您想使用离线jQuery,请//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js