javascript - Javascript / Chrome - 如何从 webkit 检查器复制对象作为代码

Question

我在我的 javascript 中执行 console.log 语句以记录 javascript 对象。我想知道是否有办法，一旦完成 - 将该对象复制为 javascript 代码。我想要做的是将使用 ajax 创建的对象转换为将 xml 提要解析为静态 javascript 对象，以便文件可以在本地运行，而无需服务器。我在 chrome 检查器窗口中包含了该对象的屏幕截图，因此您可以看到我正在尝试做什么。在此处输入图像描述

score 1566 · Accepted Answer

右键单击 Chrome 控制台中的对象，然后Store as Global Variable从上下文菜单中选择。它将返回类似于temp1变量名的内容。
Chrome 也有一个copy()方法，所以copy(temp1)在控制台中应该将该对象复制到剪贴板。

关于递归对象的注意事项：如果您尝试复制递归对象，您将获得[object Object]. 出路是尝试copy(JSON.stringify(temp1))，该对象将作为有效的 JSON 完全复制到剪贴板，因此您可以使用多种资源之一对其进行格式化。

如果您收到Uncaught TypeError: Converting circular structure to JSON消息，您可以使用JSON.stringify的第二个参数（它是一个过滤器函数）来过滤掉有问题的循环属性。有关更多详细信息，请参阅此Stack Overflow 答案。

score 70 · Accepted Answer

在 Chrome 89 或更高版本中，您只需右键单击控制台中的对象并选择Copy Object( ref )。这也适用于 Chrome 开发者工具中的其他一些地方，例如在调试时或在网络请求的响应选项卡中。

其他选项是按copy原样使用命令：

var x = { a: 1, b: 2 };
copy(x);

原始答案

score 45 · Accepted Answer

您可以使用copy(JSON.stringify(Object_Name)); 将对象复制到剪贴板；在控制台中。

例如：- 在控制台中复制并粘贴以下代码，然后按 ENTER。现在，尝试将其粘贴（Windows 为 CTRL+V，mac 为 CMD+V）粘贴到其他位置，您将得到 {"name":"Daniel","age":25}

var profile = {
    name: "Daniel",
    age: 25
};

copy(JSON.stringify(profile));

score 27 · Accepted Answer

您现在可以通过右键单击对象并选择“存储为全局变量”在 Chrome 中完成此操作：http ://www.youtube.com/watch?v=qALFiTlVWdg

score 14 · Accepted Answer

请按照以下步骤操作：

从代码中输出带有 console.log 的对象，如下所示：console.log(myObject)
右键单击对象，然后单击“存储为全局对象”。此时 Chrome 会打印变量的名称。假设它被称为“temp1”。
在控制台中，键入：JSON.stringify(temp1)。
此时，您将看到整个 JSON 对象作为可以复制/粘贴的字符串。
此时，您可以使用http://www.jsoneditoronline.org/等在线工具来美化您的字符串。

score 12 · Accepted Answer

如果您已通过请求发送对象，则可以从 Chrome -> 网络选项卡中复制它。

请求有效负载 - > 查看源代码

在此处输入图像描述

score 5 · Accepted Answer

更新 - Chrome 89

右键单击->复制对象

来源：（https://developers.google.com/web/updates/2021/01/devtools?utm_source=devtools）

也来自调试器

score 2 · Accepted Answer

您可以将对象作为字符串进行控制台

var objToString = JSON.stringify(obj)
console.log(objToString );

然后在 Notepad ++ 之类的编辑器中粘贴 de 输出，然后使用插件格式

JS格式

score 1 · Accepted Answer

Right click on data which you want to store

Firstly, Right click on data which you want to store -> select "Store as global variable" And the new temp variable appear like bellow: (temp3 variable): New temp variable appear in console
Second use command copy(temp_variable_name) like picture: enter image description here After that, you can paste data to anywhere you want. hope useful/

score 1 · Accepted Answer

这应该通过省略递归Window和对象来帮助字符串化深层Node对象。

function stringifyObject(e) {
  const obj = {};
  for (let k in e) {
    obj[k] = e[k];
  }

  return JSON.stringify(obj, (k, v) => {
    if (v instanceof Node) return 'Node';
    if (v instanceof Window) return 'Window';
    return v;
  }, ' ');
}

score 1 · Accepted Answer

这实际上帮助我解决了我的问题。但对于我正在做的事情，它是有效的。

我正在测试的设备使用 safari 调试工具，我永远无法像在 Chrome 中那样复制对象，只需右键单击并复制对象。

尝试了 JSON.stringify 并将内容粘贴到https://beautifier.io但随后必须尝试重新格式化它。

我最终使用了本地存储和复制方法。

在您的代码中使用。

localStorage.setItem('dataCopy', JSON.stringify(data));

然后只需将其粘贴到控制台中，然后单击 Enter。

copy(JSON.parse(window.localStorage.dataCopy))

然后，您在剪贴板中有您的对象数组。

score 0 · Accepted Answer

将此添加到您的控制台并执行

copy(JSON.stringify(foo));

这会将您的 JSON 复制到剪贴板

score 0 · Accepted Answer

所以，。我有这个问题，。除了我得到 [object object]

我相信你可以用递归来做到这一点，但这对我有用：

这是我在控制台中所做的：

var object_that_is_not_shallow = $("all_obects_with_this_class_name");
var str = '';
object_that_is_not_shallow.map(function(_,e){
    str += $(e).html();
});
copy(str);

然后粘贴到您的编辑器中。

score 0 · Accepted Answer

使用“存储为全局变量”有效，但它只获取对象的最终实例，而不是记录对象的那一刻（因为您可能希望在对象发生更改时比较它们）。为了在修改的确切时间点获取对象，我使用了这个......

function logObject(object) {
    console.info(JSON.stringify(object).replace(/,/g, ",\n"));
}

就这么称呼吧……

logObject(puzzle);

如果您的数据恰好包含逗号，您可能需要删除 .replace(/./g, ",\n") 正则表达式。

javascript - Javascript / Chrome - 如何从 webkit 检查器复制对象作为代码

14 回答 14

更新 - Chrome 89

Related

Reference