Html元素允许Crtl + A里面的文本

Question

我正在创建一个允许用户在表单中输入一些数据的网站，一旦提交该表单将返回一个JSON。我的网站有标题，页脚等。现在，我在div内显示JSON。

我的问题：JSON可能非常大。理想情况下，我的网站用户可以复制JSON结果并将其用于其他目的。如果用户尝试通过Ctrl + A选择整个JSON，它将选择 all 我网站中的文本，即页眉和页脚。如果用户只想获得JSON（并且它非常大），他/她将不得不手动选择JSON。

我是否可以使用HTML元素来渲染JSON（而不是div），这样当光标聚焦在此元素上时，它将允许Ctrl + A只选择所有文本在这个元素里面？类似于此的内容：http://www.jsoneditoronline.org/

我一直在寻找不同的HTML元素，例如pre，但它们无法实现我的目标。也许我没有使用正确的关键字在搜索引擎中进行搜索。

感谢。

Answer 1

textarea元素可以完成任务或将contenteditable="true"添加到任何元素，他们也可以选择所有这些方式。另外，请查看https://clipboardjs.com/，这样您就可以自动将内容复制到用户剪贴板中。