【发布时间】：2017-09-13 16:57:12
【问题描述】：
你能帮我写下我的第一个greasemonkey 脚本吗？我是一个完整的初学者，非常感谢您的帮助。我尝试了很多，但总是失败。 （编辑：我现在有一些工作）
► 简而言之，我想从奥地利报纸上赶上byline ("Kurier") 文章并添加（稍作修改） ) 到文章的打印视图。
这就是greasemonkey 脚本应该做的事情（没有外部脚本，例如 jquery）：
- 第 1 步（完成）：导航到文章 URL 后，重定向到 printview URL
- 第 2 步（完成）：从文章 URL 复制署名
- 第 3 步（几乎完成）：修改署名（见下文）
-
第 4 步：将署名粘贴到打印视图页面中
每一步的cmets：
[步骤 1]：完成
每篇文章的打印视图位于[article URL] + "/print"，
例如：
文章网址：https://kurier.at/wissen/mars-simulation-auf-hawaii/249.106.702
打印查看网址：https://kurier.at/wissen/mars-simulation-auf-hawaii/249.106.702/print
这对我有用：
// ==UserScript==
// @name KURIER printview
// @include https://kurier.at/*
// @exclude https://kurier.at/*/print
// @version 1
// @run-at document-start
// ==/UserScript==
window.location.replace(window.location + "/print");
我使用@exclude 来避免无限循环。
为了不减慢脚本速度，如果@run-at document-start 可以保持不变就好了，这样脚本就不必渲染文章页面，而是直接跳转到打印视图的 URL。因此只需渲染 1 页而不是 2 页。
（我希望步骤 2 可以从 printview 位置完成 - 或者从文章页面完成，但不渲染它？这两种方法都可以避免渲染 2 页。）
[步骤 2]：完成
署名是一个 div 容器，它有 3 种不同的形式之一（取决于作者的数量）：
• 没有作者：<div class="misc no-author">
• 单一作者：<div class="misc single-author has-image">
• 多个作者：<div class="misc multiple-authors">
以下是每种类型的示例文章：
- 没有作者：https://kurier.at/wissen/mars-experiment-auf-hawaii/218.311.221
- 单作者：https://kurier.at/wissen/mars-simulation-auf-hawaii/249.106.702
- 多位作者：https://kurier.at/wissen/mars-wann-ist-es-soweit/230.174.316
这让我们得到了 div 容器：
var $byline = document.getElementsByClassName("misc");
署名是页面上的第一个 div.misc，所以署名现在位于$byline[0]。
[第 3 步]
署名 div 容器具有以下结构：
<div class="misc [no-author/single-author/multiple-authors]">
|__ [optional content]
|__ <div class="last-modified">
|__ <div class="social-media-container">
|__ <div class="clear">
a) 应删除社交媒体容器。
b)（完成）可选内容可能包含图片。
图片 URL 方案为：https://images.kurier.at/[imagename].jpg/[size]x[size]/[imageID]
如果存在图像，则应从 更改像素值：
<img width="35" height="35" src="https://images.kurier.at/Sandra-
Lumetsberger(2)-REdit.jpg/70x70/133.396.913" alt="Sandra Lumetsberger">
到：
<img width="100" height="100" src="https://images.kurier.at/Sandra-
Lumetsberger(2)-REdit.jpg/200x200/133.396.913" alt="Sandra Lumetsberger">
我只找到了这个快速而肮脏的解决方案：
document.body.innerHTML = document.body.innerHTML.replace(
/height="35" width="35"/g,
'height="100" width="100"').replace("/70x70/", "/200x200/");
[第 4 步]
printview 页面具有以下结构：
<body>
|__ <script>
|__ <div class="wrapper">
|__ <header class="header">
|__ <div class="rfloat noprint">
|__ <p class="open12 marginb10">
|__ <div class="clear">
|__ <article>
第2步复制并在第3步修改的署名div应粘贴在p元素下方。
非常感谢！
【问题讨论】：
-
很好的问题描述但是，这更像是一个“我的代码”请求，而不是一个适当的 SO 问题。它很容易被称为“太宽泛”。您需要采取的步骤是（1）重定向，（2）AJAX 获取页面的非打印版本并解析它以获取作者信息，（3）等待当前页面达到“文档准备就绪”，（ 4) 插入您在第 2 步中的信息。
-
对不起。作为初学者，我认为这是一个狭隘的问题（复制/粘贴 div 元素），对于比我知识渊博的人来说很容易。并感谢您的提示。
标签： javascript html greasemonkey tampermonkey