私はサッカーのニュースサイトの最後の3つのニュースを表示できるChrome拡張機能を開発しようとしていました(明らかに、そのページはどのタブでも開いていません)。私の理想はiframeの中にページをロードし、ページがロードされるとページDOMにアクセスし、ニュースでテキストノードのみを抽出することでした。私は多くの方法での準備との負荷の機能を試してみましたが、私はこの解決策に従いましたhereしかし、私はいつも警告を受け取ります。私の質問は、ドメイン間のセキュリティに問題がなければ、私はそれを行うことができるのですか?私が使用できる簡単な例がありますか?Chrome拡張機能を使用してページを更新する
2
A
答えて
1
ここでは、JQueryを使ってどのように行うことができますか(JQueryについてはわかりませんが、このアプローチをどこかに見て、うまくいくと思います)。
....
http://code.google.com/chrome/extensions/xhr.html
<!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のものとなったURLを置くことを忘れてはいけません
0
xhrを使用して、ページをロードし、jQueryまたは正規表現を使用して、探しているデータの生のHTMLを解析します。
宛先サイトは、自動的にそのような方法でサイトにアクセスしたくない場合があることに注意してください。サイトとリソースを尊重してください。
関連する問題
- 1. Chrome拡張機能のページ機能を使用する
- 2. Chrome拡張機能:拡張機能を使用して、ページ上のイベントをリッスンしますか?
- 3. Chrome拡張機能 - 設定ページで拡張機能の画像
- 4. Chrome拡張機能のURLを使用してページのタイトルを取得する
- 5. Chrome拡張機能 - YouTubeで2回更新されたページの更新
- 6. Chrome拡張機能
- 7. Chrome拡張機能の背景ページ
- 8. Chrome Dev Editorを使用してChrome拡張機能を公開する
- 9. 更新時にGoogle Chrome拡張機能がクラッシュする
- 10. Google Chromeの拡張機能でJavaの拡張機能を使用してタイムゾーンのオフセットを見つける
- 11. Chrome拡張機能を使用してGoogle検索結果ページを変更する
- 12. Google Chrome拡張機能を使用してページのコンテンツを変更しますか?
- 13. Chrome拡張機能を使用してコンテンツスクリプトを使用してinnerTextを変更する
- 14. Chrome拡張機能の更新ページが表示されないとき
- 15. Chrome拡張機能newtabページ本文を修正しますか?
- 16. Chrome拡張機能の更新頻度をプログラムで変更する
- 17. 拡張機能を使用して
- 18. レスポンスコールバック後のGoogle Chrome拡張機能の更新テキスト
- 19. Google Chrome拡張機能ADS
- 20. はChromeの拡張機能
- 21. Chromeの拡張機能「バージョンエラー」
- 22. Chrome拡張機能changeInfo.status
- 23. ファイルダウンロードリスナー - Chrome拡張機能?
- 24. Chrome拡張機能:タブリスナーonSelectionChanged
- 25. はChromeの拡張機能
- 26. Chrome拡張機能:ログインオプションページ
- 27. Chrome拡張機能にリダイレクト
- 28. Google Chrome拡張機能API
- 29. Chrome拡張機能:bitcoin wallet
- 30. Chrome拡張機能/ウェブアプリセッションコントロール
ありがとうございました。それは私がやろうとしていたものです。それは完全に動作します。 – Advicer
リンクをクリックするとpopup.htmlページが表示されます。私は、クリックしたリンクのページから新しいクロムのタブを開きたいと思います。 "a"要素ごとに "target"属性を "_blank"に設定しようとしましたが、その結果、popup.htmlが新しいタブで開きました。ありがとう – Advicer
申し訳ありません、あなたのリンクを開くには、作成タブを使用してonClickイベントを配置する必要があります。 Iveはこれを行うためのコードを変更し、以前のニュースを覚えて、複数のオプションをクリックしたいと思ったときにポップアップを閉じるようにする機能を追加しました。良い学習経験。 – PAEz