我正在研究 HTML 和 Javascript 中的一些基本构造(即，我是 HTML/Javascript n00b)，并且有一个功能我似乎无法正确实现。简而言之，我想从 HTML 页面的正文中获取文本并使用 Javascript(eval() 或 new Function())对其进行评估。为查看我对 eval() 的使用是否正确，我首先尝试了以下代码，它按预期工作(并显示值 5):
<script>
window.onload = function () {
eval("var t = function () { if (5>0) return 5; }();");
document.body.innerHTML = t;
}
</script>
但是，当我随后尝试实现从 HTML 中获取“代码”并运行它的目标时，这对我来说似乎失败了。这是一段不起作用的代码(我已经尝试了很多变体):
<script>
window.onload = function() {
var x = document.getElementById("myP").innerHTML;
eval("var e = " + x + ";");
document.body.innerHTML = e();
}
</script>
<body>
<p id="myP">function () { if (5>1) { return 5; } } </p>
</body>
我测试过变量 x 确实包含正文中所需的“代码”。但由于某种原因，以上内容将无法正常工作；它只会显示正文并忽略 eval 和更新 innerHTML 后的语句。
奇怪的是，当我尝试“更复杂”的代码时，它工作正常，例如:
<script>
window.onload = function() {
var x = document.getElementById("myP").innerHTML;
eval("var e = " + x + ";");
document.body.innerHTML = e();
}
</script>
<body>
<p id="myP">function () { var a = []; var b = [1,2,3]; for (var i in b) { a.push([b[i],'q']); } return a; } </p>
</body>
我觉得这个例子应该有效但前一个却不行，这对我来说真的很奇怪； eval() 讨厌 if 语句吗？我是否遗漏了 eval() 的一些微妙方面？我是否缺少一些超基本的 Javascript 语法？感谢任何帮助，包括让上述特定实例工作，以及关于如何实现我通常尝试做的事情的建议，即将 任何 代码从 HTML 传递到 eval()。
注意:如果可能，请避免任何关于 eval() 如何“邪恶”或者是一个主要安全问题的评论/回答，或任何此类评论。我知道这些担忧。我的问题是在个人项目的上下文中，没有机会被公开部署或不安全地使用等。
最佳答案
这里的问题与 DOM 有关，而不是 JavaScript。您正在请求节点的 innerHTML。如果你看一下你最终遇到的问题就很清楚了:
var x = document.getElementById("myP").innerHTML;
console.log(x); // "function () { if (5>1) { return 5; } }"
浏览器已将 > 字符转换为 HTML 实体。你需要的是 textContent节点的:
var x = document.getElementById("myP").textContent;
console.log(x); // "function () { if (5>1) { return 5; } }"
这是一个 working example .
关于javascript - 在 HTML 文本上使用 Javascript 的 eval()，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30310555/