Cof*_*ble 2 html javascript eval
我正在玩弄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; } }"
这是一个有效的例子.