我正在尝试开发一个 Chrome 扩展程序，它可以通过每 5 分钟刷新一次来向我显示来自足球新闻网站的最近 3 条新闻（显然该页面未在任何选项卡中打开）。我的想法是在 iframe 中加载页面，一旦加载页面，访问页面 DOM 并仅提取带有新闻的文本节点。我已经尝试了多种方式使用 ready 和 load 功能，我尝试遵循这个解决方案here，但我总是收到警告。我的问题是：有没有一种方法可以做到这一点而不会遇到跨域安全问题？有什么简单的例子可以用吗？
【问题讨论】：
标签： google-chrome iframe google-chrome-extension
这是使用 JQuery 的方法（请记住，我不了解 JQuery，只是在某处看到这种方法并认为它可能对您有用）。
我把它放在一个弹出窗口中，它起作用了....
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script>
function renderNews(newsList){
$('#news').html('');
$(newsList).each(function(i,item){
var link = document.createElement('a');
$(link).attr('href',item.link);
$(link).html(item.description);
$(link).click(function(){
chrome.tabs.create({url:$(this).attr('href')});
});
var linksDate = document.createElement('span');
//$(linksDate).text(item.date);
$(linksDate).text(item.day + '-' + item.month + ' ' + item.hour + ':' + item.minute+' - ');
var listItem = document.createElement('li');
$(listItem).append(linksDate).append(link);
$("#news").append(listItem);
});
}
function getNews() {
$.get("http://www.milannews.it/?action=search§ion=32", null, function(data, textStatus)
{
if(data) {
var news=$(data).find(".list").find('li').slice(0,3) ;
$("#status").text('');
var newsList=[];
$(news).each(function(i, item){
var newsItem={};
newsItem.description=$(item).find('a').html();
newsItem.link='http://www.milannews.it/'+$(item).find('a').attr('href');
newsItem.date=$(item).find('span').first().text();
newsItem.day=newsItem.date.split(' ')[0].split('.')[0];
newsItem.month=newsItem.date.split(' ')[0].split('.')[1];
newsItem.hour=newsItem.date.split(' ')[1].split(':')[0];
newsItem.minute=newsItem.date.split(' ')[1].split(':')[1];
newsList[i]=newsItem;
});
renderNews(newsList);
localStorage.setItem('oldNews',JSON.stringify(newsList));
}
});
}
function onPageLoad(){
if (localStorage["oldNews"]!=null) renderNews(JSON.parse(localStorage["oldNews"]));
getNews();
}
</script>
</head>
<body onload="onPageLoad();" style="width: 700px">
<ul id="news"></ul>
<div id="status">Checking for new news...</div>
</body>
</html>
并且不要忘记将您通过 xhr 获得的网址放在清单的权限部分中......
http://code.google.com/chrome/extensions/xhr.html
【讨论】：
使用 xhr 加载页面并使用 jQuery 或正则表达式解析原始 HTML 以获取您要查找的数据。
请记住，目标网站可能不希望您以这种自动方式访问他们的网站。尊重他们的网站和资源。
【讨论】：