Javascript / Chrome - 如何从 webkit 检查器复制对象作为代码
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10305365/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Javascript / Chrome - How to copy an object from the webkit inspector as code
提问by mheavers
I am doing a console.log statement in my javascript in order to log a javascript object. I'm wondering if there's a way, once that's done - to copy that object as javascript code. What I'm trying to do is convert an object that was created using ajax to parse an xml feed into a static javascript object so that a file can run locally, without a server. I've included a screenshot of the object in the chrome inspector window so you can see what I'm trying to do.
我正在我的 javascript 中执行 console.log 语句以记录一个 javascript 对象。我想知道是否有办法，一旦完成 - 将该对象复制为 javascript 代码。我想要做的是将使用 ajax 创建的对象转换为静态 javascript 对象，以便文件可以在没有服务器的情况下在本地运行。我在 chrome 检查器窗口中包含了对象的屏幕截图，因此您可以看到我正在尝试做什么。
回答by kevnk
Right-click an object in Chrome's console and select
Store as Global Variablefrom the context menu. It will return something liketemp1as the variable name.Chrome also has a
copy()method, socopy(temp1)in the console should copy that object to your clipboard.
右键单击 Chrome 控制台中的对象，然后
Store as Global Variable从上下文菜单中进行选择。它将返回类似于temp1变量名的内容。Chrome 也有一个
copy()方法，所以copy(temp1)在控制台中应该将该对象复制到剪贴板。
Note on Recursive Objects:If you're trying to copy a recursive object, you will get [object Object]. The way out is to copy(JSON.stringify(temp1)), the object will be fully copied to your clipboard as a valid JSON, so you'd be able to format it as you wish, using one of many resources.
关于递归对象的注意事项：如果您尝试复制递归对象，您将获得[object Object]. 出路是copy(JSON.stringify(temp1))，对象将作为有效的 JSON 完全复制到剪贴板，因此您可以使用许多资源之一根据需要对其进行格式化。
回答by Salman A
Try JSON.stringify(). Copy the resulting string. Does not work with objects containing circular references.
试试JSON.stringify()。复制结果字符串。不适用于包含循环引用的对象。
回答by Sudharshan
You can copy an object to your clip board using copy(JSON.stringify(Object_Name));in the console.
您可以使用copy(JSON.stringify(Object_Name));将对象复制到剪贴板。在控制台中。
Eg:- Copy & Paste the below code in your console and press ENTER. Now, try to paste(CTRL+V for Windows or CMD+V for mac) it some where else and you will get {"name":"Daniel","age":25}
例如：- 将以下代码复制并粘贴到您的控制台中，然后按 ENTER。现在，尝试将其粘贴（Windows 的 CTRL+V 或 Mac 的 CMD+V）它在其他地方，您将获得 {"name":"Daniel","age":25}
var profile = {
name: "Daniel",
age: 25
};
copy(JSON.stringify(profile));
回答by David Calhoun
You can now accomplish this in Chrome by right clicking on the object and selecting "Store as Global Variable": http://www.youtube.com/watch?v=qALFiTlVWdg
您现在可以通过右键单击对象并选择“存储为全局变量”在 Chrome 中完成此操作：http: //www.youtube.com/watch?v=qALFiTlVWdg
回答by sufinawaz
Follow the following steps:
请按照以下步骤操作：
- Output the object with console.log from your code, like so: console.log(myObject)
- Right click on the object and click "Store as Global Object". Chrome would print the name of the variable at this point. Let's assume it's called "temp1".
- In the console, type:
JSON.stringify(temp1). - At this point you will see the entire JSON object as a string that you can copy/paste.
- You can use online tools like http://www.jsoneditoronline.org/to prettify your string at this point.
- 从代码中使用 console.log 输出对象，如下所示：console.log(myObject)
- 右键单击对象，然后单击“存储为全局对象”。Chrome 会在此时打印变量的名称。让我们假设它被称为“temp1”。
- 在控制台中，键入：
JSON.stringify(temp1)。 - 此时，您将看到整个 JSON 对象作为可以复制/粘贴的字符串。
- 此时，您可以使用诸如http://www.jsoneditoronline.org/ 之类的在线工具来美化您的字符串。
回答by Christopher Marshall
If you've sent the object over a request you can copy it from the Chrome -> Network tab.
如果您已通过请求发送对象，则可以从 Chrome -> 网络选项卡复制它。
Request Payload - > View Source
请求有效载荷 -> 查看源代码
回答by HoldOffHunger
Using "Store as a Global Variable" works, but it only gets the final instance of the object, and not the moment the object is being logged (since you're likely wanting to compare changes to the object as they happen). To get the object at its exact point in time of being modified, I use this...
使用“Store as a Global Variable”是有效的，但它只获取对象的最终实例，而不是对象被记录的那一刻（因为你可能想要比较对象发生的变化）。为了在修改的确切时间点获取对象，我使用了这个......
function logObject(object) {
console.info(JSON.stringify(object).replace(/,/g, ",\n"));
}
Call it like so...
像这样叫...
logObject(puzzle);
You may want to remove the .replace(/./g, ",\n") regex if your data happens to have comma's in it.
如果您的数据碰巧包含逗号，您可能需要删除 .replace(/./g, ",\n") 正则表达式。
回答by twalow
So,. I had this issue,. except I got [object object]
所以，。我有这个问题，。除了我得到 [object object]
I'm sure you could do this with recursion but this worked for me:
我相信你可以用递归来做到这一点，但这对我有用：
Here is what I did in my console:
这是我在控制台中所做的：
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);
Then paste into your editor.
然后粘贴到您的编辑器中。
回答by dummker
This should help stringify deep objects by leaving out recursive Windowand Nodeobjects.
这应该有助于通过省略递归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;
}, ' ');
}
回答by Neo_
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 hereAfter that, you can paste data to anywhere you want. hope useful/
- 首先，右键单击要存储的数据-> 选择“存储为全局变量”，新临时变量如下所示：（temp3 变量）： 新临时变量出现在控制台中
- 第二次使用命令 copy(temp_variable_name) like picture: enter image description here之后，您可以将数据粘贴到您想要的任何位置。希望有用/
