你可以在控制台使用 copy() | CSS-Tricks

至少在 Blink/WebKit 中可以。你无法在 JavaScript 中直接使用它，我确信这肯定与某些安全（或良好的品味）问题有关，因此不允许这样做。执行此操作的网站往往依赖于 Flash。但它在控制台中有效，这非常有用！

你自己的小型屏幕抓取器

这是我发现它最有用之处。页面上有一些内容，但由于某种原因，使用鼠标复制粘贴并不容易。也许其中一些内容是隐藏的。也许它与你不想要的东西混合在一起。

但是，使用一些快速的 JavaScript 选择器来获取你想要的内容非常容易。

假设你正在查看 CSS-Tricks 年鉴。

你的目标是获取所有 CSS 属性的逗号分隔列表。有多种方法可以做到这一点，但在控制台中构建你自己的快速小型屏幕抓取器会很好。

var allItems = document.querySelectorAll(".property-list .children a");

var csv = "";

[].forEach.call(allItems, function(item) {
  // do whatever
  csv += item.text + ", ";
});

copy(csv);

它输出到控制台，但也位于剪贴板中，以便于移动。

我过去甚至在 cdnjs.com 上使用它来构建一个完全符合我需要的 JSON 对象！

var newJSON = "[", name, url, thing;

$(".table-striped tbody tr").each(function(i, el) {

  thing = $(el);

  name = thing.find("td:first a").text();
  url = "https:";
  url += thing.find("td:last p").text();
  token = url.split("/");
  token = token[token.length - 1];
  token = token.split('.');
  token = token[0];

  newJSON += '{\n';
  newJSON += '  "name": "' + name + '",\n';
  newJSON += '  "value": "' + url + '",\n';
  newJSON += '  "tokens": ["' + token + '"]\n';
  newJSON += '},';

});

newJSON += "]";

copy(newJSON);

你是否曾经将 copy() 用于你认为有用的事情？

Dave

# 2015年2月3日

不错，我真的很喜欢这种类型的技巧！

它们有点像对 document.querySelectorAll 和 javascript 中的 forEach 函数的良好介绍。我承认，我的 JS 有点生疏，当我第一次看到 forEach 中的大写 E 时，它让我感到困惑，但在 RFTMing 之后，它最终成为了一个很好的小教训。

Sascha Sigl

# 2015年2月3日

太棒了！我有一个用例。在这个示例中，我想存储由 HTML5 Audio Api 生成的音频数据。我保存对象的“变通方法”是运行来自 DevTools Snippet 的 console.save() 代码片段。但这个更方便。谢谢！

Tom Davies

# 2015年2月3日

这个 copy() 技巧确实很巧妙，但为了输出 JSON 而构建字符串却相当糟糕，并且确实不值得鼓励，JSON.stringify() 是从 JS 中执行此操作的真正方法。

Chris Coyier

评论永久链接# 2015年2月7日

如果数据已经以对象的形式存在于页面上，那当然很好。这里不是这种情况。你的意思是最好先创建一个对象，然后将该对象字符串化吗？

Amelia Bellamy-Royds

# 2015年2月3日

你无法在 JavaScript 中直接使用它，我确信这肯定与某些安全（或良好的品味）问题有关，因此不允许这样做。

有一个剪贴板 API 草案规范将允许 Web 应用程序更好地控制复制粘贴事件。但正如你所料，严格的安全规则会阻止你访问系统剪贴板以执行任何用户未发起的操作。

如果实现作者认为这些事件类型可能表达用户意图，则该实现可能会允许其他受信任的事件类型修改剪贴板。该实现也可能支持配置，该配置信任特定网站或应用程序修改剪贴板，而不管脚本线程的来源如何。

合成粘贴事件不得使脚本访问真实系统剪贴板上的数据。

合成剪切和复制事件不得修改系统剪贴板上的数据。

MaxArt

评论永久链接# 2015年2月3日

是的，考虑到许多网站仍然使用 Flash 仅仅是为了使用 ZeroClipboard，这已经很久了。

Susan

# 2015年2月4日

我只是希望有人能回答一个关于使用类（例如：PHP 类或 Jquery 构建应用程序）的问题——如果你在应用程序中编写了多个 Ajax 函数、动画函数、构建多个数据库并使用 jquery 编写了超过 100,000 行代码，但没有使用其他类，这是否被认为是正常的，然后你是否可以说由此产生的程序是你自己的作品？Jquery 在 Web 构建中有多常见？

Martin Pitt

# 2015年2月6日

为什么要手动构建 json？

我刚刚在我的开发者工具中测试了一下

复制

copy(JSON.stringify({ name: 'foo', value: 1, tokens: [ 1, 2, 3 ] }, null, '\t'))

粘贴

{
    "name": "foo",
    "value": 1,
    "tokens": [
        1,
        2,
        3
    ]
}

更简单

copy({ name: 'foo', value: 1, tokens: [ 1, 2, 3 ] })

粘贴

{
  "name": "foo",
  "value": 1,
  "tokens": [
    1,
    2,
    3
  ]
}

参数的顺序基本上是保证的

var obj = {};
obj.name = 'foo';
obj.value = 1;
obj.tokens = [ 1, 2, 3 ];
copy(obj);

粘贴

{
  "name": "foo",
  "value": 1,
  "tokens": [
    1,
    2,
    3
  ]
}

Chris Coyier

评论永久链接# 2015年2月7日

再说一遍，如果你已经有一个格式完全符合你需要的对象，那太好了。在这种情况下，我正在遍历 DOM 找到我需要的少量信息，它不是一个很好的对象。如果是，当然，这只是一个字符串化并复制该对象的很好的技巧。

此评论线程已关闭。如果你有重要信息需要分享，请联系我们。