将JavaScript函数转换为字符串以便插入innerHTML的正确方法

这就是我正在做的：我正在建立一个有趣的内部API投票系统。我正在使用客户端代码段插入页面

像这样：

<script src="domain.com/api/scripts/main.js"></script>
<div id="content-wrap" id="ac1e435e-c564-48f8-9f45-338616e7a789"></div>

正如你所看到的，在我构建它的过程中，这会引起很多问题。 有什么更好的方法来实现这一点，或者有没有一种方法可以让我只编写脚本/代码并执行类似的操作

script.innerHTML = ConvertToString(script.js) OR ConvertToString(function X);

ConvertToString只是我用来解释我想做什么而不是我正在做什么的一个表达式

谢谢，我愿意接受任何建议。 我还必须在纯JavaScript或jQuery库中执行此操作，因此任何关于使用VueJs、AngularJS或React的建议都将作为将来的参考

再次感谢你

补充说明：

我想在我的脚本元素中插入JavaScript片段。但我的代码片段目前大约有30行，并且可能会随着时间的推移而变大，因此很难在我编写的每一行上使用所有+代码进行编码，这样就可以将它与innerHTML一起插入元素并在客户端执行

所以我想做一些类似的事情

element.innerHTML = mysnippetcode // but with out using + "" on each line like shown above

OR

element.append(snippet)

我希望这能让事情变得更清楚一点

---

对我有效的解决方案是使用回标记来包装我的sinppet并将其插入元素的innerHTML中

只需使用函数名，无需将其转换为字符串：

function foo() {
var a = 10;
var b = 20;
var c = a + b;
return c;
}


document.write(foo);

document.write将生成以下字符串：

function foo() { var a = 10; var b = 20; var c = a + b; return c; }

如果只需要函数的主体，那么通常可以删除字符串的第一个和最后一个字符

我不完全确定这是你想要的，如果不是，请你说清楚

或者，您可以执行eval[insert function code here]，无需将代码添加到脚本的innterHTML中，如果您没有听说过该函数，请阅读该函数

或者，如果要从字符串创建函数，可以使用新函数[name]、[function body string]，如果需要参数，则必须将它们夹在两个参数之间

但是我的代码片段目前大约有30行，并且可能会随着时间的推移而变大>，因此很难在我编写的每一行中使用所有+代码进行编码 写

如果希望在Javascript中使用多行字符串，可以使用模板文本，只需将引号替换为反勾号即可

---

如果您感兴趣，可以查看MDN页面，甚至可以查看StackOverflow的答案。

真的没有必要将javascript写入innerHTML吗？此外，即使你在描述一个问题时有额外的解释，也可能是重复的。正如@Taurus所问的，你真正想要实现什么？您的回答是：我想在我的脚本元素JavaScript代码片段中插入，但这是您为实现实际目标而提出的解决方案。也许将JS作为字符串注入并不是实现您真正想要实现的目标的方法。谢谢，我尝试了您的两个建议，但它们没有提供我想要的结果。@IamCavic您真正想要实现的是什么？你想根据你得到的AJAX数据生成一些HTML吗？我刚刚用更多信息更新了我的问题。。我正在做的是在第一次调用服务器时创建和填充包装器。。。现在，我想添加额外的JAVASCRIPT代码，当用户和内容交互时，它会做一些事情。。我完成了所有这些工作，但是我通过.innerHTML=javascriptcode添加的额外JavaScript都是以字符串形式编写的，很难跟踪我正在做的事情。。因此，我想将sinppet插入dom元素，而不必将其作为string@IamCavic所以你有两个问题：1。将某物插入元素2中。在插入代码字符串时避免所有这些+s。确保这是一个问题，取决于你如何处理它。我需要做些什么才能让我的代码平静下来，不必先把它变成一个字符串就可以.append或.innerHTML。

function foo() { var a = 10; var b = 20; var c = a + b; return c; }