Javascript 命令插入 HTML答案

【问题标题】：Javascript command insertion HTMLJavascript 命令插入 HTML
【发布时间】：2015-12-29 14:46:22
【问题描述】：

我想创建一个 JavaScript 命令执行 .. 我的意思是，如果我用输入法构建一个页面，那么该输入法的值会在 JavaScript 控制台中执行，那么，该执行的结果应该插入到 HTML 标记中，如下所示： HTML：

<input id="commandInsertion"/>
<input type="Submit" onclick="doCommand()">
<p id="result"></p>

JavaScript：

var doCommand = function(x) {
   // The command should be something like this
   Execute(x); // Imaginary Function
   document.getElementById('result').innerHTML = ResultOf(x);
   // ResultOf() is also an imaginary function
};

doCommand 是一个执行命令然后将其打印到文档中的函数

【问题讨论】：

执行命令的意思是只想在浏览器控制台中显示命令？
不清楚您所说的 javascript 控制台 是什么意思，我的解释是：您需要一个执行 x 的函数和另一个执行x 的结果将其写入文档，对吗？
FWIW 您不能在 input 元素上设置 innerHTML 的值。请参阅What is innerHTML on input elements? 尝试设置value 属性或使用可包含innerHTML 的其他HTML 占位符，例如div。
你的意思是 eval("alert('lol')") 吗？
输入元素没有innerHTML。您可以使用 .val() 或将输入元素更改为 div。

标签： javascript jquery html

【解决方案1】：

简单。听说过eval？这是一个有趣而危险的功能。它允许您在运行时评估代码。这是一个例子：

$('#calc').on('input', function() {
  try {
    $('#out').val(eval($('#calc').val()));
  } catch (e) {
    $('#out').val('ERROR!')
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
Input:
<br>
<input id='calc'>
<br>Output:
<br>
<input id='out'>

这很简单，但 eval 也可能很危险。它可以让攻击者做任何你能做的事情。您可能想阅读以下内容：

Restricting eval() to a narrow scope

这是你想要的代码：

var doCommand = function() {
  // The command should be something like this
  document.getElementById('output').innerHTML = eval(document.getElementById('commandInsertion').value);
};

<input id="commandInsertion" />
<div id="output"></div>
<br>
<br>
<input type="Submit" onclick="doCommand()">

【讨论】：

您的两个示例似乎都不起作用。也许eval() 在 SO 编辑器中被抑制了。？
我想在输入法里面插入一个值，当我点击提交时，它被执行。当我打开控制台（F12）函数被执行，截至：输入应该有var Xeiad = "Hello World!"; 然后当我打开控制台（ F12 ）并输入 console.log(Xeiad); 它应该返回 Hello World! eval() 在直接通过控制台执行时有效，但不是通过获取输入法的值..你的答案似乎工作，但这不是我想要找到的答案，无论如何，感谢您的帮助，我会尝试使用您的输入法收集数据的方式

【解决方案2】：

我从你的解释中得到的信息是你需要一些东西，例如：

function getInsertedValue() {
  var txt = document.getElementById('commandInsertion').value;
  updateElem(txt);
}

function updateElem(insertedTxt) {
  document.getElementById("updatedTxt").innerHTML = eval(insertedTxt);
}

<div>
  <input type="text" id="commandInsertion" />
  <span id="updatedTxt"></span>
  <input type="Submit" onclick="getInsertedValue()">
</div>

【讨论】：

您的代码似乎并没有完全符合我的要求，但是谢谢，我不得不将函数中的insertedTxt 从..ML = insertedTxt.. 更改为..ML = eval(insertedTxt)..

【解决方案3】：

你不是说eval函数吗？

eval() 函数计算或执行参数。

非常小心地使用它——它允许用户运行任何 javascript 命令，这是一个很大的安全风险。

【讨论】：