Html-Select如何将字符串值转换为javascript而不使用eval()？

Question

我在一些文章中看到过，在()方法中使用JavaScript并不是一个好的实践。因此，我希望找到一种在selectedColorValue上获得相同值的方法，而无需使用eval()，并且能够操作这个值。我试过了

const selectedColorValue = color.optionscolor.selectedIndex；但是任何成功。

HTML

<select name="" id="color">
     <option value="blue">blue</option>
     <option value="red">red</option>
     <option value="green">green</option>
</select>

JAVASCRIPT

 const color = document.getElementById('color');

 //const selectedColorValue = eval(color.value);

Answer 1

似乎您的eval是不必要的，只需从元素本身检索value属性，它就会将其返回给变量color。

const color = document.getElementById('color').value; 

或者如果您希望将元素保留为变量：

const color = document.getElementById('color'); 
const selectedColorValue = color.value;  //No need for eval

Answer 2

您只是在脚本中缺少了一个.value，如下所示：

请点击下面的Run code snippet蓝色按钮。

​

function getValue()
{

const color = document.getElementById('color').value;
console.log(color);

}

<select name="" id="color" onchange='getValue()'>
     <option value="blue">blue</option>
     <option value="red">red</option>
     <option value="green">green</option>
</select>

​