2

スクリプト内で DOM オブジェクトを HTML ページに変換する方法はありますか?

次のような dom オブジェクトがあるとします: content script.js

chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
  if (request.method == "fromPopup") {
     console.log("got Request from Popup");   
     var myDivObj = document.getElementById("definition");
   //sendResponse({data: "from Content Script to Popup"});
   if ( myDivObj ) {
     sendResponse({data:myDivObj});
     }
     else{
     sendResponse({data:"Empty or No Tag"});
     }
      console.log("sent Response1");   
  } else {
    sendResponse({}); // snub them.
    console.log("sent Response2");   
  }
});

ここに私のpopup.htmlがあります

<body>
  <Div>Searching..</Div>
  <Div id="output">Response??</Div>
  <script>
  console.log("Pop UP Clicked");
 chrome.tabs.getSelected(null, function(tab) {
  chrome.tabs.sendRequest(tab.id, {method: "fromPopup", tabid: tab.id}, function(response) {

    console.log("got Response from Content Script");   
    document.getElementById("output").innerHTML=response.data;
  });
});
  </script>


</body>

popup.html ページに送信できるのは JSON タイプのデータのみです。

はいの場合、収集した DOM オブジェクト ( myDivObj ) を使用して HTML ページを作成する方法はありますか..

代替ソリューション..?

要するに、DOMオブジェクトの現在のタブページの特定の部分のみを取得し、popup.htmlまたは別のhtmlページに表示したい..

4

1 に答える 1

2

を使用します。これは、HTML の再構築に使用できる文字列を返します。sendResponse({data:myDivObj.outerHTML});

ノート：

  • 動的に追加されたイベント リスナーとプロパティは、属性/コンテンツ変更メソッドが使用されない限り失われます ( setAttribute('key','value')/ .innerHTML=...'.
  • スタイル シートにより、要素の外観が異なる場合があります。

警告: 任意のページからやみくもにコードを挿入しないでください。そうしないと、拡張機能にセキュリティ ホールが開いてしまいます。ポップアップ内のすべてのスクリプトは、許可されているすべての拡張 API に完全にアクセスできます。

于 2012-06-30T09:12:52.400 に答える