是否可以从 javascript 函数中插入代码块？ [复制]答案

【问题标题】：Is it possible to insert code block from a javascript function? [duplicate]是否可以从 javascript 函数中插入代码块？ [复制]
【发布时间】：2020-12-10 07:30:20
【问题描述】：

例如给定这样的事情

const stuff = [{"a": "b"}]
const inhtml = document.querySelector(".exists")
const pre = document.createElement("pre")
pre.appendChild(document.createTextNode(stuff))
inhtml.appendChild(pre)

我希望它在代码块中动态输出数组 [{"a": "b"}]

除了它只是输出 [Object object ...]

【问题讨论】：

一个问题是代码从不使用变量stuff
您可以使用 JSON.stringify(obj) 帮助将对象转换为字符串。
哦，这行得通！有没有办法正确格式化它@PotatoParser
是的！您可以执行 JSON.stringify(obj, null, '\t') ，它会自动在内部设置键/值！
这正是我想要的谢谢

标签： javascript html

【解决方案1】：

你可以使用JSON.stringify()来显示文字：

const stuff = [{"a": "b"}];
const inhtml = document.querySelector("div#main");
const pre = document.createElement("pre");
const code = document.createElement("code");

code.innerHTML = JSON.stringify(stuff, null, '\t');
code.style.backgroundColor = '#ebccca';

pre.appendChild(code);

inhtml.appendChild(pre);

<p>Code goes below here</p>

<div id="main"></div>

【讨论】：

嗨，这行得通。有没有办法格式化呢
您可以使用 CSS 格式化输出。
@shah 我已经更新了答案。
哦，那么没有css就没有办法在代码块中对基本的javascript颜色进行颜色编码吗？
您可以使用javascript设置样式属性。我已经更改了答案以显示如何。