我正在制作一个在页面上粘贴按钮的 GreaseMonkey 脚本。单击此按钮时，它会拉出一个新页面。理想情况下，我希望能够像普通 HTML 页面一样格式化此页面。我的限制是我无法制作新的 HTML 文件。生成的所有内容都需要来自这个 GreaseMonkey 脚本。
我的 GreaseMonkey 将这段代码粘贴在原始页面的正文中
<input type="button" value="push me" onclick="openWin()">
点击时调用此函数:
function openWin()
{
myWindow=window.open('','','width=400,height=500');
myWindow.document.write("Hello World");
myWindow.focus();
}
我想在打开的新窗口中放置的不仅仅是 Hello World。我想在那里放一张 table ，设置文本样式，在其中放图片等。有没有一种简洁的方法可以做到这一点？
提前致谢。
最佳答案
聪明而简单的做法是使用 GM_getResourceText()Doc .
这样，您只需简单地制作弹出页面，页面加载到本地，就像您的 GM 脚本一样，然后使用 3 行简单的代码填充您的智能弹出页面。
例如创建两个文件如下:
Popup_fun.user.js :
// ==UserScript==
// @name _Fancy popups, the smart way
// @include http://YOUR_SERVER.COM/YOUR_PATH/*
// @include http://stackoverflow.com/questions/*
// @require http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
// @resource popupSrcRz PopupPage.htm
// @grant GM_getResourceText
// ==/UserScript==
//-- Don't refire on the popup.
if ( $("#gmDontFireOnMe").length === 0) {
$("body").prepend (
'<button id="gmLaunchPopup">Launch a fancy popup</button>'
);
$("#gmLaunchPopup").click (openWin);
}
function openWin () {
var popupSrc = GM_getResourceText ("popupSrcRz");
myWindow=window.open ('','','width=400,height=500');
myWindow.document.write (popupSrc);
myWindow.document.close ();
myWindow.focus ();
}
弹出页面.htm :
<!DOCTYPE html>
<html><head>
<title>My fancy popup</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
body { padding: 0 3ex; }
table {
margin: 1em;
padding: 0;
border-collapse: collapse;
border: 1px solid darkBlue;
}
th, td {
margin: 0;
padding: 0.8ex 1em;
vertical-align: top;
text-align: left;
border: 1px solid darkBlue;
}
th { background: lightYellow; }
img { max-width: calc(100% - 3ex); }
</style>
</head><body>
<p id="gmDontFireOnMe">I'm the popup page.</p>
<p>Here's a table:</p>
<table class="">
<tr><th>Thing</th><th>Qty</th></tr>
<tr><td>Flux</td><td>88</td></tr>
<tr><td>Capacitor</td><td>88</td></tr>
</table>
<p>Here's an image:</p>
<img src="http://media2.s-nbcnews.com/j/MSNBC/Components/Photo/_new/tdy-121010-puppies-03.grid-6x2.jpg"
alt="Awwww!">
</a>
</body></html>
将这两个文件保存到同一目录(但不在系统临时文件夹中)，然后安装 Popup_fun.user.js，使用 Firefox 的打开菜单(CtrlO)。
当您重新加载此页面并单击按钮时，您将看到一个漂亮的格式化弹出窗口。
如果您在某处托管您的脚本，只需将 PopupPage.htm 复制到同一文件夹即可。它会在安装脚本时自动安装。
关于javascript - 格式化 document.write() 的内容，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17849574/