Chrome扩展：获取DOM对象中当前标签页的特定部分，并将其显示在popup.html或新的HTML页面中？ [英] chrome extension: get specific part of the current tab page in DOM object and display it in either popup.html or new html page?
问题描述
假设我有这样的dom对象：内容是否有任何方式，以便我可以将任何DOM对象转换为HTML页面
在脚本内？ script.js
chrome.extension.onRequest.addListener（function（request，sender，sendResponse）{
if（ request.method == fromPopup）{
的console.log（ 从弹出了请求）;
变种myDivObj =的document.getElementById（ 定义）;
// 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（{}）; //缓存它们
console.log（sent Response2）;
}
}）;
这里是我的popup.html
<身体GT;
< Div>搜寻..< / div>
< Div id =output>回应??< / 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（从Content Script获得响应）;
document.getElementById（output）。innerHTML = response.data;
}）;
}）;
< / script>
< / body>
我知道我们可以发送onaly JSON类型的数据到popup.html页面。
我是对的吗？
如果是，那么我可以使用DOM对象（myDivObj）创建HTML页面，我收集了
..
任何替代解决方案..？
总之，我只想获取DOM对象中当前标签页的特定部分，将它显示在popup.html或单独的html页面中。
使用 sendResponse（{data： myDivObj .outerHTML }）; 。这将返回可用于重构HTML的字符串。 注释： 警告：不要盲目地从任意页面插入代码，否则会在扩展中打开一个安全漏洞：弹出窗口中的所有脚本有权访问所有允许的扩展API。 IS there any way so that i can convert any DOM object into HTML page
within the script ? suppose I have dom object like this: content script.js
setAttribute（'key'，'value'） / <$ c），动态添加的事件侦听器和属性将丢失$ c> .innerHTML = ...'。
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");
}
});
here is my 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>
I know we can send onaly JSON type of data to the popup.html page.. am i right ?
If yes is ther any way that I can creat HTML page with DOM Object( myDivObj ) which I collected..
Any alternative solution..?
In short i want get only specific part of the current tab page in DOM object and display it in either popup.html or separate html page..
Use sendResponse({data:myDivObj.outerHTML});. This returns the string which can be used to re-construct the HTML.
Notes:
- Dynamically added event listeners and properties are lost, unless attribute/content-modifying methods are used (
setAttribute('key','value')/.innerHTML=...'. - The element may look different, because of style sheets.
Warning: Do not blindly inject the code from arbitrary pages. Otherwise, you're opening a security hole in your extension: All scripts in the popup have full access to all permitted extension APIs.
这篇关于Chrome扩展：获取DOM对象中当前标签页的特定部分，并将其显示在popup.html或新的HTML页面中？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
