我有一个脚本可以获取当前服务器时间并且效果很好。问题是,我想在页面上的时钟之前插入服务器时间(显示本地时间,即使网站上的事件告诉您可以在特定服务器时间再次执行此操作)。由于某种原因,我不知道如何将这个该死的东西粘在我想要的地方。
无需登录即可访问的目标页面是 Here
我想要在之前插入节点的 div 的 id 似乎是 clock-wrapper
我尝试过的代码:(插入警报和console.log之间,在下面的“原始脚本”中)
var textNode = document.createElement('b');
var clock=document.getElementById('clock-wrapper');
textNode.appendChild ('<b>' + serverTime + '</b>');
clock.parentNode.insertBefore(textNode, clock);
和
var textNode = document.createElement('b');
var getRef = document.getElementById("clock-wrapper");
var parentDiv = getRef.parentNode;
parentDiv.insertBefore(textNode, getRef);
这是原始脚本:
// ==UserScript==
// @name test server time
// @namespace http://trueidiocy.us
// @include https://www.google.com
// @include http://stackoverflow.com
// @include http://www.thepikaclub.co.uk*
// @require http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
// @grant GM_xmlhttpRequest
// ==/UserScript==
GM_xmlhttpRequest ( {
url: location.href,
method: "HEAD",
onload: function (rsp) {
var serverTime = "Server date not reported!";
var RespDate = rsp.responseHeaders.match (/\bDate:\s+ (.+?) (?:\n|\r)/i);
if (RespDate && RespDate.length > 1) {
serverTime = RespDate[1];
}
alert ("Server Time: " + serverTime);
console.log ("Server Time: ", serverTime);
}
} );
我在这里缺少什么?我是否只需要找到比我在未来脚本中使用的更好的引用源?另外,让脚本再次运行以每分钟左右更新一次时间有多困难?
最佳答案
问题中的第一个代码片段无效(错误的 appendChild
调用),但第二个代码片段可以工作 - 除了 <b>
之外。添加标签时内容为空。
无论如何,由于您的基本脚本正在(明智地)加载 jQuery,使用它。 jQuery 的 .before()
在这里效果很好。代码是:
GM_xmlhttpRequest ( {
url: location.href,
method: "HEAD",
onload: function (rsp) {
var serverTime = "Server date not reported!";
var RespDate = rsp.responseHeaders.match (/\bDate:\s+(.+?)(?:\n|\r)/i);
if (RespDate && RespDate.length > 1) {
serverTime = RespDate[1];
}
$("#clock-wrapper").before ('<b>' + serverTime + '</b>');
}
} );
<小时/>
如果您想每分钟重新获取一次服务器时间,请使用 javascript 的 setInterval()
。但您需要避免创建多个 <b>
标签,因此代码需要额外检查。它变成:
getServerTime (); //-- Initial call
//-- Recheck every minute
var clkRefreshTimer = setInterval (getServerTime, 60 * 1000); // 60 seconds
function getServerTime () {
GM_xmlhttpRequest ( {
url: location.href,
method: "HEAD",
onload: function (rsp) {
var serverTime = "Server date not reported!";
var RespDate = rsp.responseHeaders.match (/\bDate:\s+(.+?)(?:\n|\r)/i);
if (RespDate && RespDate.length > 1) {
serverTime = RespDate[1];
}
//-- Does our display node already exist?
var ourTimeDisp = $("#gmTimeDisplay");
if (ourTimeDisp.length) {
ourTimeDisp.text (serverTime);
}
else {
$("#clock-wrapper").before (
'<b id="gmTimeDisplay">' + serverTime + '</b>'
);
}
}
} );
}
<小时/>
但是,您可能会聪明地查找如何向页面添加 JS 时钟并仅调用 GM_xmlhttpRequest
一次只是为了初始化您的新时钟。然后你的时钟 JS 会按照你喜欢的频率更新它,而不会加重服务器的负担。
关于javascript - 使用 Greasemonkey 在现有元素之前插入文本节点时出现问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19262601/