Question

我迫切需要编写Tampermonkey / Greasemonkey脚本的帮助，该脚本将Web页面中的部分信息包含在页面（和窗口）标题中。

客户名称是目标（内部）网页的一部分，并在HTML中清楚地标记：

<div id="patient-info" class="ehr-patients-info">
    <div id="patient-identification">
        <span title="" id="patient-name">
            Johnnyfirst

            Smithylast
        </span>
    </div>
...

我想在窗口标题中添加文本“ Johnnyfirst Smithylast”并尝试：

var ptname = document.getElementById("patient-name") ;
document.title = document.title + " | Name: " + ptname ;

但这导致标题如下：... | Name: null。

第二个问题是，我piggy带此用户脚本的网站无法一次全部加载。初始页面加载后，将具有大量的javascript功能，该功能会加载页面的各个部分并最终显示如上的客户端名称。

当我尝试$(window).on('load', function() { ... })或$(document).ready()时，它似乎是在尚未完全加载信息的网页的初始版本上工作。

Answer 1

您的目标页面是AJAX驱动的，Greasemonkey/Tampermonkey fires way before most AJAX page loads finish。因此，您必须使用MutationObserver，waitForKeyElements等技术来补偿。

例如，这是一个完整的 Tampermonkey 脚本，该脚本在找到patient-name节点时会更改标题：

// ==UserScript==
// @name     _Put the patient Name in the title
// @match    *://YOUR_SERVER.COM/YOUR_PATH/*
// @noframes
// @require  https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant    GM_addStyle
// @grant    GM.getValue
// ==/UserScript==
// @grant    none
//- The @grant directives are needed to restore the proper sandbox.
/* global waitForKeyElements */
/* eslint-disable no-multi-spaces, curly */
'use strict';

waitForKeyElements ("#patient-name, .patient-name", scrapeTextToTitle);

function scrapeTextToTitle (jNode) {
    var nameRaw         = jNode.text ().trim ();
    var nameSanitized   = nameRaw.replace (/\s+/g, " ");
    document.title     += " | Name: " + nameSanitized;
}

如何获取网页中包含的文本并将其作为页面标题的一部分？

1 个答案: