有什么方法可以将任何 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>
我知道我们只能将 JSON 类型的数据发送到 popup.html 页面。 我说得对吗？
如果是的话，我可以用 DOM 对象( myDivObj )创建 HTML 页面吗？ 我收集了..
任何替代解决方案..？
简而言之，我只想获取 DOM 对象中当前选项卡页面的特定部分，并将其显示在 popup.html 或单独的 html 页面中。
最佳答案
使用sendResponse({data:myDivObj<b><a href="https://developer.mozilla.org/en/DOM/element.outerHTML" rel="noreferrer noopener nofollow">.outerHTML</a></b>}); 。这将返回可用于重新构造 HTML 的字符串。
注释:
- 除非使用属性/内容修改方法，否则动态添加的事件监听器和属性将会丢失 (
setAttribute('key','value')/.innerHTML=...'。 - 由于样式表的原因，元素可能看起来有所不同。
警告:不要盲目地从任意页面注入(inject)代码。否则，您将在扩展程序中打开一个安全漏洞:弹出窗口中的所有脚本都具有对所有允许的扩展程序 API 的完全访问权限。
关于javascript - chrome 扩展 : get specific part of the current tab page in DOM object and display it in either popup. html 或新的 html 页面？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11261715/