2

我想将网页下载为 html 文件。在我将网页源代码保存为 html 文件之前，我想先编辑一些页面内容。我假设我可以使用 Javascript 编辑内容。不幸的是，我对 Javascript 的经验很少。我想我必须将我的脚本注入网页，以便浏览器可以一起执行它们。我应该如何编写我的脚本？我是否应该编写一个独立的脚本并将页面 url 传递给我的脚本，以便它们可以同时执行？或者还有其他方法可以注入我的脚本？

编辑：为了让我的问题更清楚，请参阅这篇文章和这篇文章

4

3 回答 3

3

由于您只执行此操作一次，因此从浏览器 JavaScript 控制台启动脚本就足够了。打开开发人员工具，导航到控制台选项卡，粘贴脚本内容，然后按 Enter。

要获取编辑后的 ​​HTML，请document.documentElement.outerHTML在控制台中计算表达式。将输出复制到您选择的文本编辑器，在其前面添加一个 doctype，然后将其保存为 html。

于 2013-01-11T06:57:55.743 回答
1

如果您想将修改后的源代码保存为 html，您可以使用不同的方法，具体取决于您要进行的主要操作。遗憾的是，使用 javascript 保存文件很棘手并且取决于很多事情，因此您可以使用选项手动复制粘贴文件源或编写浏览器和设置特定的文件保护程序。我更喜欢 javascript+php 组合解决方案。或者，如果不需要使用 javascript 来操作某些东西，我会完全在 php 中完成。

第 1 步 - 在 chrome 和 firefox 中使用控制台打开浏览器 CTRL+SHIFT+J 并允许弹出窗口。第 2 步 - 打开您想要的网页 第 3 步 - 将下一个代码复制到控制台

//Script loading function
function load_script( source ) {
    var new_script  = document.createElement('script');
    new_script.type = 'text/javascript';
    new_script.src = source;
    new_script.className = 'MyInjectedScript';
    document.getElementsByTagName('head')[0].appendChild(new_script);
}
function escapeHtml(unsafe) {
  return unsafe
      .replace(/&/g, "&")
      .replace(/</g, "&lt;")
      .replace(/>/g, "&gt;")
      .replace(/"/g, "&quot;")
      .replace(/'/g, "&#039;");
}
//Load jQuery, if page do not have it by default
if (typeof(jQuery) != 'function') load_script('http://code.jquery.com/jquery-latest.js');

第 4 步 - 在控制台中进行操作

第 5 步 - 将下一个代码复制到控制台

//In the end remove your injected scripts
$('.MyInjectedScript').remove(); //Or jquery script will be in source
//get Document source
var doc_source = $('html',document).html();
doc_source = '<html>'+doc_source+'</html>';


var new_window = window.open('', '', 'scrollbars=yes,resizable=yes,location=yes,status=yes');
$(new_window.document.body).html('<textarea id="MySource">'+escapeHtml(doc_source)+'</textarea>');

第 6 步 - 从打开的窗口文本区域复制粘贴代码

如果你想用 PHP 来做，你可以很容易地用 curl 下载页面并根据需要操作内容和保存文件。

于 2013-01-11T08:01:07.290 回答
0

您可以使用Requestly 之类的浏览器扩展程序在网页上注入自定义 Javascript/ CSS 。

这就是你可以做到的。

  1. 下载请求和打开规则页面
  2. 创建新规则并选择插入自定义脚本/CSS 规则类型
  3. 输入您的域（或页面 URL 模式）并定义您的脚本

屏幕截图 - 插入脚本规则

请求插入脚本功能

如果您正在寻找跨浏览器解决方案，那么您可以使用Requestly 桌面应用程序并类似地配置您的规则。

在您的特定情况下，您可以选择一个选项，例如在页面加载后运行脚本，以便在修改/注释它们之前所有 DOM 元素都存在于页面上。

免责声明 - 我请求构建

于 2022-02-12T04:47:07.577 回答