Question

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

像这样：

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

现在在我的主.JS中我做了所有ajax请求并修改了#content-wrap，创建了新元素并插入了运行投票系统所需的额外JS。

我遇到的最大问题是当我编写需要插入#content-wrap的JavaScript时，我正在编写这样的内容：

script.innerHTML = "$(someting).on('click', funciton(){"
+ "$.ajax({type: 'post',"
+ " url: '" + base + "/api/request', data: $('form').serialize(), "
+ "success: function(response){";

正如您所看到的那样，在我的基础上可能会导致很多问题。有什么方法可以实现这一点，或者有一种方法可以编写我的脚本/代码并执行类似的操作。

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

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

谢谢，我对任何建议持开放态度。我也必须在纯JavaScript或jQuery库中执行此操作，因此任何使用VueJs，AngularJS或React的建议都将被视为未来参考。

再次感谢您

补充说明：

我想在我的脚本元素中插入JavaScript代码段。但是我的代码片段当前大约有30行，并且随着时间的推移会变得更大，因此很难在我编写的每一行上使用所有+ " code "进行编码，以便可以将innerHTML插入到元素中并在客户端执行。

所以我宁愿喜欢做这样的事情

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

OR

element.append(snippet)

我希望这会让它变得更加清晰

对我有用的解决方案是使用后面的刻度来包装我的sinppet并将其插入元素的innerHTML中。

Answer 1

只需使用不带()的函数名称将其转换为字符串：

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，如果您没有听说过，请阅读该函数。

或者如果你想从一个字符串创建一个函数，你可以使用new Function([name] ,[function body string])如果需要参数，你必须将它们夹在两个参数之间。

但我的代码片段目前大约有30行，并且随着时间的推移可能会变得更大＆gt;因此很难用我在每一行的所有+“代码”进行编码写

如果你想在Javascript中使用多行字符串，你可以使用模板文字，你只需要用反引号替换你的引号。

如果您有兴趣，请参阅this MDN页面，甚至是this StackOverflow回答。

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

1 个答案: